最近閑著沒(méi)有事决左，就學(xué)了一點(diǎn)H5的知識(shí)撒踪，現(xiàn)在可以寫一些簡(jiǎn)單點(diǎn)的頁(yè)面了，下面就是我總結(jié)的一些H5的知識(shí)浦箱。
一：網(wǎng)頁(yè)的組成
? ? ?1.HTML? 網(wǎng)頁(yè)的具體內(nèi)容和結(jié)構(gòu)
? ? ?2.CSS? ? 網(wǎng)頁(yè)的樣式
? ? ?3.JavaScript? 網(wǎng)頁(yè)的交互效果吸耿，比如對(duì)用戶鼠標(biāo)事件作出響應(yīng)祠锣。
二.常見(jiàn)的HTML標(biāo)簽?
? ? ?1.標(biāo)題： h1,h2,h3,h4,h5…
? ? ?2.段落：p
? ? ?3.換行：br
? ? ?4.容器：div，scan(用來(lái)容納其他標(biāo)簽)
? ? ?5.表格：table咽安，tr,td
? ? ?6.列表：ul,ol,li
? ? ?7.圖片：img
? ? ?8.表單：input
? ? ?9.鏈接：a?
三：H5新增標(biāo)簽新增了27個(gè)標(biāo)簽元素伴网，包括結(jié)構(gòu)性標(biāo)簽，級(jí)塊性標(biāo)簽板乙，行內(nèi)語(yǔ)義性標(biāo)簽是偷， 交互性標(biāo)簽。下面是用的比較多的一些屬性
? ? ?1.article:文章主題內(nèi)容
? ? ?2.header：標(biāo)記頭部區(qū)域內(nèi)容
? ? ?3.footer：標(biāo)記腳部區(qū)域內(nèi)容
? ? ?4.section：區(qū)域章節(jié)表述
? ? ?5.nav：菜單導(dǎo)航募逞，鏈接導(dǎo)航行內(nèi)語(yǔ)義性標(biāo)簽
? ? ?6.meter：特定范圍內(nèi)的數(shù)值，如工資馋评，數(shù)量放接，百分比
? ? ?7.time：時(shí)間值
? ? ?8.progress：進(jìn)度條，可用max,min,step進(jìn)行控制留特，完成對(duì)進(jìn)度的表示和監(jiān)聽(tīng)
? ? ?9.video：視頻元素纠脾，用于視頻播放，支持緩沖預(yù)載和多種視頻媒體格式
? ? ?10.audio：音頻元素蜕青，用于音頻播放苟蹈，支持緩沖預(yù)載和多種音頻媒體格式
四：CSS
? ? ? A：什么是CSS? 它是用來(lái)控制HTML標(biāo)簽的樣式，在美化網(wǎng)頁(yè)中起到非常重要的作用右核。
? ? ? B：CSS的3種書寫形式
? ? ? ? ? 1.行內(nèi)樣式
? ? ? ? ? 2.頁(yè)內(nèi)樣式
? ? ? ? ? 3.外部樣式
? ? ? C:CSS的兩大重點(diǎn)
? ? ? ? ? 1.屬性通過(guò)屬性的復(fù)雜疊加才能做出漂亮的網(wǎng)頁(yè)
? ? ? ? ? 2.選擇器通過(guò)選擇器找到對(duì)應(yīng)的標(biāo)簽設(shè)置樣式
? ? ? ? ? 3.CSS選擇器?
? ? ? ? ? ? ? ? ? a. 標(biāo)簽選擇器?
? ? ? ? ? ? ? ? ? b.類選擇器?
? ? ? ? ? ? ? ? ? c.id選擇器
? ? ? ? ? ? ? ? ? d.并列選擇器?
? ? ? ? ? ? ? ? ? e.復(fù)合選擇器?
? ? ? ? ? ? ? ? ? f.后代選擇器??
? ? ? ? ? ? ? ? ? g.直接后代選擇器?
? ? ? ? ? ? ? ? ? h.相鄰兄弟選擇器
? ? ? ? ? ? ? ? ? i.屬性選擇器?
? ? ? ? ? ? 4. 選擇器的作用 選擇對(duì)應(yīng)的標(biāo)簽慧脱，為之添加樣式
? ? ? ? ? ? 5.選擇器的優(yōu)先級(jí) ? ?選擇器的針對(duì)性越強(qiáng)，他的優(yōu)先級(jí)越高?
? ? ? ? ? ? 6.選擇器的權(quán)限? ??
? ? ? ? ? ? ? ? ? ?通配選擇符：0? ??
? ? ? ? ? ? ? ? ? ?標(biāo)簽：1? ??
? ? ? ? ? ? ? ? ? ?類：1? ??
? ? ? ? ? ? ? ? ? ?屬性：10? ??
? ? ? ? ? ? ? ? ? ?偽類：10? ??
? ? ? ? ? ? ? ? ? ?偽元素：10? ?
? ? ? ? ? ? ? ? ? ?id:100? ?
? ? ? ? ? ? ? ? ? ?important:1000?
? ? ? ? ? ? 7.原則：選擇器的權(quán)值加到一起贺喝，大的優(yōu)先菱鸥，如果權(quán)值相同，后定義的優(yōu)先躏鱼。 ? ? ? ? ? ? ? ? ? ? ?
? ? ? ? ? ? important >內(nèi)聯(lián) >id >類>標(biāo)簽|偽類|屬性選擇>偽元素>通配符>繼承
?五：HTML標(biāo)簽類型主要分為三大類型：?
? ? ? ? ? ? ? ? ? 1.塊級(jí)標(biāo)簽：獨(dú)占一行的標(biāo)簽氮采，能隨時(shí)設(shè)置寬度和高度（比如：div,p,h1,h2,ul,ui）
? ? ? ? ? ? ? ? ? 2.行內(nèi)標(biāo)簽（內(nèi)聯(lián)標(biāo)簽）多個(gè)行內(nèi)標(biāo)簽?zāi)芡瑫r(shí)顯示在一行，寬度和高度取決于內(nèi)容的尺寸（比如span,a,label）
? ? ? ? ? ? ? ? ? 3.行內(nèi)-塊級(jí)標(biāo)簽（內(nèi)聯(lián)-塊級(jí)標(biāo)簽）多個(gè)行內(nèi)-塊級(jí)標(biāo)簽可以顯示在同一行,能隨時(shí)這只寬度和高度（比如input,button）
?六：修改標(biāo)簽的顯示類型 ? ? CSS中有個(gè)display屬性染苛，能修改標(biāo)簽的顯示類型
? ? ? ? ? ? ? ? ? none:隱藏標(biāo)簽
? ? ? ? ? ? ? ? ? block：讓標(biāo)簽變成塊級(jí)標(biāo)簽
? ? ? ? ? ? ? ? ? inline：讓標(biāo)簽變?yōu)樾袃?nèi)標(biāo)簽
? ? ? ? ? ? ? ? ? inline-block：讓標(biāo)簽變?yōu)樾袃?nèi)—塊級(jí)標(biāo)簽
七：盒子模型網(wǎng)頁(yè)上的每一個(gè)標(biāo)簽都是一個(gè)盒子鹊漠。每個(gè)盒子都有四個(gè)屬性
? ? ? ? ? ? 1.內(nèi)容:content
? ? ? ? ? ? 2.填充：padding （內(nèi)邊距） ?例：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布局默認(rèn)情況下，所有的網(wǎng)頁(yè)標(biāo)簽都在標(biāo)準(zhǔn)流布局中從上到下茶行，從左到右脫離標(biāo)準(zhǔn)流的方法有：
? ? ? ? ? ?1.float屬性 ? ?left：脫離標(biāo)準(zhǔn)流躯概，浮動(dòng)在父標(biāo)簽的最左邊。 ? right：脫離標(biāo)準(zhǔn)流拢军，浮動(dòng)在父標(biāo)簽的最右邊
? ? ? ? ? ?2.position屬性和left楞陷，right，top,bottom屬性
? position屬性：fixed：生成絕對(duì)定位的元素茉唉，相對(duì)于瀏覽器窗口進(jìn)行定位固蛾。
? ? ? ? ? ? ? ? ? ? ? ? absolute與relative結(jié)合使用（子絕父相）
?十：HTML中標(biāo)簽的居中?
? ? ? ? 水平居中 ? ? ? ? 行內(nèi)標(biāo)簽和行內(nèi)-塊級(jí)標(biāo)簽：text-align:center?
? ? ? ? ? ? ? ? ? ? ? ? ? ? ? 塊級(jí)標(biāo)簽：margin:0px auto ? ? ? ? ?
? ? ? ? 垂直居中：line-height
十一：JavaScript的書寫方式
? ? ? ? ? 1.業(yè)內(nèi)樣式
<script type="text/javascript"></script>
? ? ? ? ? 2.外部JS
<script src=“index.js”></script>
好了结执，暫時(shí)就這么多吧，感覺(jué)比較亂艾凯，這些都是我邊學(xué)邊整理的献幔，有錯(cuò)誤的話歡迎大家指正。
