国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

【芝士整理】HTML的標(biāo)簽們

stonezhu / 2934人閱讀

摘要：讀一遍文檔后的個人總結(jié)，重點(diǎn)在于整理語義化標(biāo)簽的定義規(guī)范，記錄各種部件容易被忽略的特性。結(jié)構(gòu)化，通過標(biāo)簽先后順序和嵌套語法給樹提供基礎(chǔ)。標(biāo)簽列表基于個人理解即非官方描述，給標(biāo)簽劃分為結(jié)構(gòu)化標(biāo)簽語義化標(biāo)簽功能化標(biāo)簽，文檔標(biāo)簽。

讀一遍MDN文檔后的個人總結(jié)，重點(diǎn)在于整理語義化標(biāo)簽的定義規(guī)范，記錄各種部件容易被忽略的特性。
關(guān)于HTML

HTML的作用可以簡單總結(jié)為結(jié)構(gòu)化、語義化和提供基礎(chǔ)API支持（HTML5）。

結(jié)構(gòu)化，通過標(biāo)簽先后順序和嵌套語法給DOM樹提供基礎(chǔ)。

語義化，語義化標(biāo)簽給內(nèi)容正確的意思、作用和外形。合理使用語義化標(biāo)簽的意義在于貼合規(guī)則，這樣信息更加容易被檢索和利用，比如說可以輔助瀏覽器自動生成大綱、更容易讓屏幕閱讀器讀出網(wǎng)頁內(nèi)容。

功能支持，基礎(chǔ)的比如超鏈接、圖片顯示功能，HTML5中的音視頻功能、矢量圖、3D圖像等等。

標(biāo)簽列表

基于個人理解（即非官方描述），給標(biāo)簽劃分為結(jié)構(gòu)化標(biāo)簽、語義化標(biāo)簽、功能化標(biāo)簽，文檔標(biāo)簽。

結(jié)構(gòu)化標(biāo)簽

不包含特定語義及功能

div - 塊級內(nèi)容容器

span - 內(nèi)聯(lián)內(nèi)容容器

br - 換行

hr - 分隔線

語義化標(biāo)簽

包含特定語義，用戶代理一般會給特殊樣式表示，但無既定功能

header - 頁面的頁眉或者一個節(jié)段的頭部

nav - 主要鏈接集合，footer里的附加鏈接集可以不用nav

main - 文檔的主體部分，一般是包含中心主題或主要功能的內(nèi)容放置區(qū)

article - 獨(dú)立結(jié)構(gòu)，可獨(dú)立分配或可復(fù)用的內(nèi)容結(jié)構(gòu)，比如論壇帖子、評論

section - 一個節(jié)段，一個專題組

aside - 獨(dú)立于主體內(nèi)容的部分，比如說廣告區(qū)，側(cè)邊欄

footer - 頁面的頁腳，或一個階段的尾部

figure - 獨(dú)立引用單元，比如引用圖片，常和figcaption配合使用

h1-h6 - 標(biāo)題

p - 文本段落

ul+li - 無序列表

ol+li - 有序列表

dl+dt+dd - 描述列表，一個術(shù)語可有多條描述，多個術(shù)語也可共享同條描述。dl - description list, dt - description terms, dd - description description


    
Apple Inc.

    
is an American multinational technology company

em - 強(qiáng)調(diào)語氣，默認(rèn)樣式為斜體

strong - 著重強(qiáng)調(diào)，默認(rèn)樣式為粗體

i - 應(yīng)用在傳統(tǒng)上用斜體表達(dá)的內(nèi)容，比如說技術(shù)術(shù)語、外國文字之類的

b - 應(yīng)用在傳統(tǒng)上用粗體表達(dá)的內(nèi)容，比如說關(guān)鍵字、產(chǎn)品名稱等

u - 應(yīng)用在傳統(tǒng)上用下劃線表達(dá)的內(nèi)容，比如說拼寫錯誤

blockquote - 塊引用，cite屬性可表示引用源

q - 行內(nèi)引用，同有cite屬性

cite - 引文，如果引用源需要具體的文字顯示，則需要這么使用

HTML5 是定義 HTML 標(biāo)準(zhǔn)的最新的版本

abbr - 縮略語

PRC

address - 聯(lián)系信息


    You can contact author at www.somedomain.com.

    If you see any bugs, please contact webmaster.

    You may also want to visit us:

    Mozilla Foundation

    1981 Landings Drive

    Building K

    Mountain View, CA 94043-0801

    USA

功能化標(biāo)簽

a - 超鏈接

HTML5

相對URL和絕對URL的優(yōu)劣：絕對URL需要查詢DNS找到服務(wù)器再請求，相對URL則會根據(jù)當(dāng)前服務(wù)器地址直接請求

URL可使用mailto鏈接直接出發(fā)郵件應(yīng)用，mailto鏈接可加入一些郵件信息

使用download屬性可指定保存文件名

img - 圖片



添加字幕文件






audio - 音頻
沒有poster, width, height屬性，其他與video類似






picture - 兼容多格式圖片（比如webP的應(yīng)用）的容器，支持自適應(yīng)加載，edge13以上支持



 
 

// 標(biāo)簽內(nèi)容跨越小部件時，可以用label包裹


  







input - 單行輸入框



readonly屬性規(guī)定無法輸入，disabled屬性禁止一切行為form表單數(shù)據(jù)中會剔除該部件數(shù)據(jù)。


type屬性，email/password/search/tel/url/number/range/color/date/hidden/radio/checkbox/file







select + option - 下拉選擇器




// optgroup增加選框標(biāo)題







datalist - 自動補(bǔ)全選擇器


兼容性：IE10以下不受支持，Safari不支持




    Mac OS
    Windows
    Linux








文檔標(biāo)簽



  - 聲明文檔類型，規(guī)定頁面需要遵循的規(guī)則




 - 描述文檔的數(shù)據(jù)




 - 文檔字符編碼，描述在這個文檔中允許被使用的字符集



 - name部分規(guī)定描述的信息類型，content部分規(guī)定描述的信息內(nèi)容


一些站點(diǎn)設(shè)定有專用的元數(shù)據(jù)協(xié)議會在其站點(diǎn)內(nèi)顯示特定信息，比如說Facebook的Open Graph Data







 - 指定外部資源，并規(guī)定外部資源與當(dāng)前文檔的關(guān)系









附錄

HTML5 標(biāo)簽列表 - From MDN
           
               
                                           
                       
                 

            
                     
             
               

                   
 文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

                 
                   
轉(zhuǎn)載請注明本文地址：http://specialneedsforspecialkids.com/yun/54682.html

               

                      
               
              

              

                
相關(guān)文章

                
    
                             
                                                                                                    
  • 
                                                
    
                          
    【前端芝士樹】詳解CSS盒模型、BFC、OffsetWidth&ClientWidth&am
    
                                                     
    摘要：提供了糟糕的支持，而雖然接近標(biāo)準(zhǔn)，但依舊未能完全正確的支持標(biāo)準(zhǔn)。盡管修復(fù)了許多的問題，但是依然延續(xù)實(shí)現(xiàn)中的其它故障主要是盒模型問題。因此大部分的聲明將觸發(fā)嚴(yán)格模式即依據(jù)標(biāo)準(zhǔn)的規(guī)則渲染網(wǎng)頁。

深入理解CSS盒模型、BFC、OffsetWidth&ClientWidth&ScrollWidth
本文將從盒模型開始，一步步涉及一些常見的前端筆試和面試點(diǎn) 主要參考自第一篇文章，然而筆者在讀的時...
    
                                                   
                          
    
                                
    
                                    binta
                                    
                                    評論0 
                                    收藏0 
                                
    
                          
    
                      
    
                    
    •  
                                                                                       
  • 
                                                
    
                          
    【芝士整理】CSS基礎(chǔ)圖譜
    
                                                     
    摘要：為了實(shí)現(xiàn)文字環(huán)繞效果，規(guī)范規(guī)定的措施是使父容器塌陷，元素脫離文檔流浮動產(chǎn)生，元素周圍的內(nèi)容轉(zhuǎn)換為圍繞元素排列。

選擇器注意點(diǎn)
屬性選擇器

[attr^=value] - 開頭或全等
[attr$=value] - 結(jié)尾或全等
[attr*=value] - 包含值
[attr~=value] - 字符串包含

選擇器組

A > B - 直接子節(jié)點(diǎn)
A + B - 下一個兄弟節(jié)點(diǎn)
A...
    
                                                   
                          
    
                                
    
                                    iOS122
                                    
                                    評論0 
                                    收藏0 
                                
    
                          
    
                      
    
                    
    •  
                                                                                       
  • 
                                                
    
                          
    【前端芝士樹】Javascript的原型與原型鏈
    
                                                     
    摘要：在創(chuàng)建對象不論是普通對象還是函數(shù)對象的時候，都有一個叫做的內(nèi)置屬性，用于指向創(chuàng)建它的構(gòu)造函數(shù)的原型對象，也就是。因?yàn)橐粋€普通對象的構(gòu)造函數(shù)所以原型鏈原型鏈的形成是真正是靠而非。參考文章最詳盡的原型與原型鏈終極詳解，沒有可能是。

【前端芝士樹】Javascript的原型、原型鏈以及繼承機(jī)制
前端的面試中經(jīng)常會遇到這個問題，自己也是一直似懂非懂，趁這個機(jī)會整理一下
0. 為什么會出現(xiàn)原型和...
    
                                                   
                          
    
                                
    
                                    yy736044583
                                    
                                    評論0 
                                    收藏0 
                                
    
                          
    
                      
    
                    
    •  
                                                                                       
  • 
                                                
    
                          
    【芝士整理】瀏覽器存儲
    
                                                     
    摘要：維護(hù)瀏覽器和服務(wù)器端會話狀態(tài)的一種方式，一般用于保存用戶身份信息。服務(wù)器端生成推送到瀏覽器端，瀏覽器負(fù)責(zé)保存和維護(hù)數(shù)據(jù)。

Cookie
維護(hù)瀏覽器和服務(wù)器端會話狀態(tài)的一種方式，一般用于保存用戶身份信息。
服務(wù)器端生成Cookie推送到瀏覽器端，瀏覽器負(fù)責(zé)保存和維護(hù)數(shù)據(jù)。
特點(diǎn)
域名下的所用請求都會帶上Cookie
每條Cookie限制在4KB左右
Cookie在過期時間之前一直有效，若...
    
                                                   
                          
    
                                
    
                                    whlong
                                    
                                    評論0 
                                    收藏0 
                                
    
                          
    
                      
    
                    
    •  
                                                                           
                

              

              
               

                  
                  
發(fā)表評論

                   
               

              

                

                  
0條評論
   
                
 
                      

              

           

           

              
 
                

                   
              
  

                  
最新活動
 
           
                             
              





                                
              

           

        

      
 
    

    
     

      
    

    
    

    
       
       

         
閱讀需要支付1元查看
  
         
     
       

      
  
    
    













<