一天搞定HTML----标签语义化04
生活随笔
收集整理的這篇文章主要介紹了
一天搞定HTML----标签语义化04
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
根據頁面里不同的內容，選擇最適合它的標簽，而不通篇只用一種標簽
標簽語義化作用：
代碼演示
通過比較- - -H5布局和DIV+CSS 布局- - -體現標簽語義化
注意：
標簽語義化，不僅僅只是指使用特定含義的標簽。因此不能完全否定DIV+CSS布局是沒有語義化的，以前用的都是DIV+CSS布局，它是存在標簽語義化的。 這里只是為了說明語義化，使用兩者比較。 <!DOCTYPE html> <html><head><meta charset="UTF-8"><title></title></head><body><!--標簽語義化根據頁面里不同的內容，選擇最適合它的標簽，而不通篇只用一種標簽1、方便后期添加樣式2、提高代碼的可讀性3、內容的可讀性比較高說明：按照DIV+CSS這種布局方式，通篇都是div，可讀性不高，不方便修改代碼現行一般采用新增的H5標簽，每個標簽都有特定的含義，可讀性大大提高。代碼如下--><!--H5布局方式：只要看到標簽，我們就很容易得知這部分做的功能--><!--1.公共頭部--><header>主要用于頁面的頭部，還可以放板塊的頭部</header><!--2.導航公用標簽--><nav>用于制作導航導航</nav><!--3.主題板塊--><section>頁面中的版塊，用來區分頁面中的不同區域</section><!--4.文章板塊--><article>文章</article><!--5.底部信息，一般是公司連接，版權申明，公司地址等等--><footer>頁面底部</footer><!--6.補充的附屬信息--><aside>附屬信息</aside><!--時間--><time>用來放時間：2015年6月7日 13:31:30</time><!--DIV+CSS布局方式：通篇都是DIV，不容易得知是什么板塊，做的什么功能--><div class="public_header">頁面的頭部</div><div class="public_nav">導航</div><div class="panel">主體</div><div class="article">文章</div><div class="footer">頁面底部</div><div class="aside">附屬信息</div></body> </html>總結
以上是生活随笔為你收集整理的一天搞定HTML----标签语义化04的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 一天搞定HTML----列表标签03
- 下一篇： 一天搞定CSS：css选择器--07