最近閑著沒有事，就學了一點H5的知識，現在可以寫一些簡單點的頁面了，下面就是我總結的一些H5的知識。
一：網頁的組成
? ? ?1.HTML? 網頁的具體內容和結構
? ? ?2.CSS? ? 網頁的樣式
? ? ?3.JavaScript? 網頁的交互效果，比如對用戶鼠標事件作出響應。
二.常見的HTML標簽?
? ? ?1.標題： h1,h2,h3,h4,h5…
? ? ?2.段落：p
? ? ?3.換行：br
? ? ?4.容器：div，scan(用來容納其他標簽)
? ? ?5.表格：table，tr,td
? ? ?6.列表：ul,ol,li
? ? ?7.圖片：img
? ? ?8.表單：input
? ? ?9.鏈接：a?
三：H5新增標簽新增了27個標簽元素，包括結構性標簽，級塊性標簽，行內語義性標簽， 交互性標簽。下面是用的比較多的一些屬性
? ? ?1.article:文章主題內容
? ? ?2.header：標記頭部區域內容
? ? ?3.footer：標記腳部區域內容
? ? ?4.section：區域章節表述
? ? ?5.nav：菜單導航，鏈接導航行內語義性標簽
? ? ?6.meter：特定范圍內的數值，如工資，數量，百分比
? ? ?7.time：時間值
? ? ?8.progress：進度條，可用max,min,step進行控制，完成對進度的表示和監聽
? ? ?9.video：視頻元素，用于視頻播放，支持緩沖預載和多種視頻媒體格式
? ? ?10.audio：音頻元素，用于音頻播放，支持緩沖預載和多種音頻媒體格式
四：CSS
? ? ? A：什么是CSS? 它是用來控制HTML標簽的樣式，在美化網頁中起到非常重要的作用。
? ? ? B：CSS的3種書寫形式
? ? ? ? ? 1.行內樣式
? ? ? ? ? 2.頁內樣式
? ? ? ? ? 3.外部樣式
? ? ? C:CSS的兩大重點
? ? ? ? ? 1.屬性通過屬性的復雜疊加才能做出漂亮的網頁
? ? ? ? ? 2.選擇器通過選擇器找到對應的標簽設置樣式
? ? ? ? ? 3.CSS選擇器?
? ? ? ? ? ? ? ? ? a. 標簽選擇器?
? ? ? ? ? ? ? ? ? b.類選擇器?
? ? ? ? ? ? ? ? ? c.id選擇器
? ? ? ? ? ? ? ? ? d.并列選擇器?
? ? ? ? ? ? ? ? ? e.復合選擇器?
? ? ? ? ? ? ? ? ? f.后代選擇器??
? ? ? ? ? ? ? ? ? g.直接后代選擇器?
? ? ? ? ? ? ? ? ? h.相鄰兄弟選擇器
? ? ? ? ? ? ? ? ? i.屬性選擇器?
? ? ? ? ? ? 4. 選擇器的作用 選擇對應的標簽，為之添加樣式
? ? ? ? ? ? 5.選擇器的優先級 ? ?選擇器的針對性越強，他的優先級越高?
? ? ? ? ? ? 6.選擇器的權限? ??
? ? ? ? ? ? ? ? ? ?通配選擇符：0? ??
? ? ? ? ? ? ? ? ? ?標簽：1? ??
? ? ? ? ? ? ? ? ? ?類：1? ??
? ? ? ? ? ? ? ? ? ?屬性：10? ??
? ? ? ? ? ? ? ? ? ?偽類：10? ??
? ? ? ? ? ? ? ? ? ?偽元素：10? ?
? ? ? ? ? ? ? ? ? ?id:100? ?
? ? ? ? ? ? ? ? ? ?important:1000?
? ? ? ? ? ? 7.原則：選擇器的權值加到一起，大的優先，如果權值相同，后定義的優先。 ? ? ? ? ? ? ? ? ? ? ?
? ? ? ? ? ? important >內聯 >id >類>標簽|偽類|屬性選擇>偽元素>通配符>繼承
?五：HTML標簽類型主要分為三大類型：?
? ? ? ? ? ? ? ? ? 1.塊級標簽：獨占一行的標簽，能隨時設置寬度和高度（比如：div,p,h1,h2,ul,ui）
? ? ? ? ? ? ? ? ? 2.行內標簽（內聯標簽）多個行內標簽能同時顯示在一行，寬度和高度取決于內容的尺寸（比如span,a,label）
? ? ? ? ? ? ? ? ? 3.行內-塊級標簽（內聯-塊級標簽）多個行內-塊級標簽可以顯示在同一行,能隨時這只寬度和高度（比如input,button）
?六：修改標簽的顯示類型 ? ? CSS中有個display屬性，能修改標簽的顯示類型
? ? ? ? ? ? ? ? ? none:隱藏標簽
? ? ? ? ? ? ? ? ? block：讓標簽變成塊級標簽
? ? ? ? ? ? ? ? ? inline：讓標簽變為行內標簽
? ? ? ? ? ? ? ? ? inline-block：讓標簽變為行內—塊級標簽
七：盒子模型網頁上的每一個標簽都是一個盒子。每個盒子都有四個屬性
? ? ? ? ? ? 1.內容:content
? ? ? ? ? ? 2.填充：padding （內邊距） ?例：padding：10px 5px 15px 20px (上右下左)邊框
? ? ? ? ? ? 3.邊框：border? ? 例：border屬性border:border-width ,border-style,border-color
? ? ? ? ? ? 4.邊界：margin（外邊距） 例：margin:10px 5px 15px 20px (上右下左)
?八：CSS3新增屬性
? ? ? ? ? ?1.RGBA透明度
? ? ? ? ? ?2.塊陰影與圓角陰影 box-shadow,text-shadow
? ? ? ? ? ?3.圓角 border-radius?
? ? ? ? ? ?4.邊框圖片：border-image
? ? ? ? ? ?5.形變：transform
?九：CSS布局默認情況下，所有的網頁標簽都在標準流布局中從上到下，從左到右脫離標準流的方法有：
? ? ? ? ? ?1.float屬性 ? ?left：脫離標準流，浮動在父標簽的最左邊。 ? right：脫離標準流，浮動在父標簽的最右邊
? ? ? ? ? ?2.position屬性和left，right，top,bottom屬性
? position屬性：fixed：生成絕對定位的元素，相對于瀏覽器窗口進行定位。
? ? ? ? ? ? ? ? ? ? ? ? absolute與relative結合使用（子絕父相）
?十：HTML中標簽的居中?
? ? ? ? 水平居中 ? ? ? ? 行內標簽和行內-塊級標簽：text-align:center?
? ? ? ? ? ? ? ? ? ? ? ? ? ? ? 塊級標簽：margin:0px auto ? ? ? ? ?
? ? ? ? 垂直居中：line-height
十一：JavaScript的書寫方式
? ? ? ? ? 1.業內樣式
<script type="text/javascript"></script>
? ? ? ? ? 2.外部JS
<script src=“index.js”></script>
好了，暫時就這么多吧，感覺比較亂，這些都是我邊學邊整理的，有錯誤的話歡迎大家指正。
