Jo今天又在學(xué)什么？（1）
今天學(xué)的是Up主Archimesons的HTML入門。課程鏈接：https://www.bilibili.com/video/BV1jf4y1J7Ms/?spm_id_from=333.999.0.0
評價：
Pros：作為入門視頻，前幾個視頻講解簡單明了，比我看的很多YouTube上的視頻清楚很多
Cons：課程后期大概是為了縮短時長時長，邏輯框架開始開始有點亂，此外某些tag Up不展開解釋，所以只看視頻不能理解，需要自己去查
以下是學(xué)習(xí)筆記：
0. html是什么
html不是一種編程語言，而是一種標(biāo)記語言。
html格式必須以.html為文件名后綴才能打開。網(wǎng)頁主頁默認(rèn)為Index.html，about 頁面是xxx.com/about。
1. 標(biāo)簽的解釋<tagname>?
? ? 大部分標(biāo)簽需要前后兩個標(biāo)簽才能閉合，*筆記中</tagname>均被省列
? ? 少部分標(biāo)簽可以自閉合
? ? ? ? 如：<br> <hr> <input>
? ? 一個html文件最基本和通用的指令：
? ? ? ? <!DOCTYPE html> Defines the document type
? ? ? ? <html> ? Defines an HTML document，內(nèi)部可以加其他meta信息
2. html網(wǎng)頁的基本結(jié)構(gòu)
<head> <title> <body> <p>是html中最常見的四個定位tag
? ? <head> 區(qū)域內(nèi)的內(nèi)容和網(wǎng)頁呈現(xiàn)給用戶的界面沒有關(guān)系
? ? ? ? 用于 1.定義頁面的作用和標(biāo)題
? ? ? ? ? ? ?2.鏈接其他工程文件
? ? ? ? ? ? ?3.SEO keywords
? ? ? ? <meta>標(biāo)簽：標(biāo)簽位于文檔的頭部，不包含任何內(nèi)容?？商峁┯嘘P(guān)頁面的元信息，比如針對搜索引擎和更新頻度的描述和關(guān)健詞.
? ? <title>顯示于瀏覽器標(biāo)題位置
? ? <body>區(qū)域是網(wǎng)頁顯示的內(nèi)容
? ? <p>在<body>以下，是paragraph的縮寫，顯示文字段落
? ? <!--note section--> 是標(biāo)注標(biāo)簽，不顯示于頁面中，只用于開發(fā)者標(biāo)注段落內(nèi)容
3. 文字及排版
? ? 3.0 標(biāo)簽屬性 attributes
? ? 除了tagname標(biāo)簽之外，還可為某個標(biāo)簽增加更多屬性，attributes的格式為name="value"，通常直接加在tagname標(biāo)簽的閉合里面。
? ? 3.1 文字格式
? ? ? ? <h1> to <h6> 字號大小
? ? ? ? <strong> 加粗
? ? ? ? <em> ?斜體
? ? ? ? <a> 超鏈接 通常后跟“href”=鏈接地址?
? ? ? ? ? ? 如：<a href="http://www.baidu.com" target="_blank">
? ? ? ? "style" 如：<p style=color:顏色;>; <p style=front:大小數(shù)字px；> ? ?
? ? ?3.2 段落 ??
? ? ? ? <br> 空格（自閉合） break
? ? ? ? <hr> 水平分割線（自閉合） horizontal rule
? ? ? ? <div> 分割（自閉合）
? ? ? ? <pre> </pre> preserved space
? ? 3.3 列表
? ? ? ? <ul> <li> 列表，顯示為點 ?
? ? ? ? <ol> <li> 列表，顯示為數(shù)字
? ? 3.4表格標(biāo)簽 <table> </table>
? ? ? ? <thead> （table head） ?表頭，通常是文字名稱
? ? ? ? <tbody> table body ? ? 表體
? ? ? ? <th> table head ? ? ? ?表格橫名稱
? ? ? ? <tr> table row ? ? ? ? 表格列名稱
? ? ? ? <td> table cell defination 表格內(nèi)容
? ? ? ? ? ? 現(xiàn)在的表格使用css文字搭建。
? ? 3.5 表單 <form> </form>
? ? ? ? <lable> 輸入框的標(biāo)簽
? ? ? ? ? ? <lable for=xxx> for為megatag，注釋lable的內(nèi)容
? ? ? ? 類型1 ：<input> 輸入
? ? ? ? <input type=> “type”定義輸入的內(nèi)容類型，type作為attribute可以有很多種值（10種），如“text”“color”“date”等。具體可在https://www.w3schools.com/tags/tag_input.asp查詢
? ? ? ? <input><textarea> 可調(diào)整文字框大小
? ? ? ? 類型2： <select> 選擇
? ? ? ? <select>后加選擇的項目 <option value=xxx>。可有多個option選項。
? ? ? ? ? ? select和option均不是自閉合標(biāo)簽，需要手動閉合。
4. 媒體
? ? 4.1 圖片<img> 自閉合標(biāo)簽
? ? ? ? 如：<img src="w3schools.jpg" alt="W3Schools.com" width="104" height="142">
? ? ? ? ? ? “scr”為source file，可以指定網(wǎng)絡(luò)圖片和本地圖片
? ? ? ? ? ? “alt”=alternative text 圖片備選文本
? ? ? ? ? ? “hight” 長度
? ? ? ? ? ? “width” 寬度
HTML字典：https://www.w3schools.com/tags/default.asp
CSS延伸內(nèi)容：
? ? 塊級元素 <display:block>
? ? 行級元素 <display:inline>
