學習html文法的規範性

來源:互聯網
上載者:User

標籤:sublime   div   前端   span   sub   影響   節點   作用   webstorm   

    不管學習什麼語言第一開始都是在學習其文法規範,前端也不例外,首先我們講解一下學習前端語言所使用的編輯器,現在在市面上大多使用的編輯器有:sublime     webstorm   HB等等,其實前端語言就算是使用簡單的記事本也可以進行編輯,編輯器只是開發過程中的一種工具,我們主要考慮的是使用何種編輯器能夠提高我們的開發效率。在這裡我們以sublime為編輯器說明。其次我們講解一下前端中html的文法特性:html是有各種的標籤組成,html只在乎標籤的嵌套結構,嵌套關係,誰嵌套誰,和換行、空格無關,不影響頁面的顯示,但要嚴格按格式寫,html中所有 文字之間有空格、換行、tab都將被摺疊為一個空格顯示也就是說html不是依據縮排來表示嵌套的,就是看標籤的嵌套關係,但良好的縮排,代碼更易讀,壓縮是為了追求極致的載入速度,所有沒有換行、縮排。成對的標籤要封閉。

html文法

使用四個空格的縮排,這是保證代碼在各種環境下顯示一致的唯一方式。

嵌套的節點應該縮排(四個空格)。

在屬性上,使用雙引號,不要使用單引號。

不要在自動閉合標籤結尾處使用斜線 - HTML5 規範 指出他們是可選的。

不要忽略可選的關閉標籤(例如, 和 </body>)

許多初學者都會或多或少的寫錯,但可能他們還不自知,因為效果一樣能夠輸出,比如:雙標籤沒有閉合,一些標點符號使用中文的,嵌套結構不正確等等。

html標籤

html標籤可分為容器級標籤和文本級標籤;

其中容器級標籤主要有:div  h1-h6  ul>li   ol>li 等

它的特點是可以直接給元素設定寬高,且寬度預設是父級元素寬度的百分百,高度自適應,它非常的“霸道”,在標準文檔流下不與其他的元素共存一行,但它可以嵌套任何的標籤包括它本身,注意成組的標籤不然ul>li ,ul的下一級只能寫li  li下面可以嵌套任何的標籤。

文本級標籤 主要有:span  a  img   input p  等

它的特點是不能直接設定寬高,寬高世自適應內容的寬高,且在標準文檔流下可以與其他的文本級元素共存一行 

每一個標籤都有自己的的語義,及其所對應的預設樣式,像是我們會經常使用div來布局只充當一個盒子的作用,ul>li這一組標籤經常配合css用作導航條的部位。

以上只是前端中html的一些介紹,對於html這部分內容個人建議在學習的過程中先記憶每一個元素的基本預設樣式及常用於哪些地方,至於它們之間該如何嵌套比較的合適,一方面自己要使用一下,另一方面要看別的案例加以學習及總結。

學習html文法的規範性

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.