CSS 語義化標記拋棄DIV標記

2022-09-25 16:09:12 字數 1608 閱讀 7024

曾經,設計師們經常會跟頻繁使用基於table的沒有任何語義的布局。不過最終還是要感謝像jeffrey zeldman和eric meyer這樣的思想革新者,聰明的設計師們慢慢的接受了相對更語義化的布局替代了table布局,並且開始呼叫外部樣式表。但不幸的是,複雜的網頁設計需要大量不同的標籤結構**,我們把它叫做「-soup」 綜合症。也許你很熟悉下面的**:

複製**

**如下:

程式設計客棧section">

posted on july 11th, 2009

lorem ipsum text blah blah blah.

lorem ipsum text blah blah blah.

lorem ipsum text blah blah blah.

tags: hmtl, code, demo

lorem ipsum text blah blah blah.

lorem ipsum text blah blah blah.

lorem ipsum text blah blah blah.

tags: hmtl, code, demo

儘管這有些勉強,但上面這個例項還是可以說明使用html4對乙個複雜的設計進行**化後依然過於臃腫(其實xhtml1.1也不過如此)。不過值得激動的是,html5解決「-soup」 綜合症並帶給我們一套新的結構化元素。這些新的html5元素富有更細緻的語義從而代替了那些毫無語義的標籤,並同時為css的呼叫提供了」自然」的css鉤子。下面是html5的解決方案例項:

複製**

**如下:

posted on july 11th, 2009

lorem ipsum text blah blah blah.

lorem ipsum text blah blah blah.

lorem ipsum text blah blah blah.

>

tags: hmtl, code, demo

lorem ipsum text blah blah blah.

lorem ipsum text blah blah blah.

www.cppcns.com lorem ipsum text blah blah blah.

程式設計客棧

tags: hmtl, code, demo

正如我們所見,html5可以讓我們用很多更語義化的結構化**標籤代替那些大量的無意義的標籤。這種語義化的特性不僅提公升了我們網頁的質量和語義,並且大量減少了曾經**中用於css必須呼叫的class和id屬性。事實上,css3也是可以然通過我們忽略掉所有class和id的。

本文標題: css 語義化標記拋棄div標記

本文位址: /web/css/28242.html

點讚打賞

分享如果認為本文對您有所幫助請贊助本站

宣告:凡註明"本站原創"的所有文字等資料,版權均屬程式設計客棧所有,歡迎**,但務請註明出處。

標籤:css  語義化

純css搞定按鈕、鏈結點選時的虛線不使用class和id進行網頁布局的方法

您可能感興趣的文章:

廣告贊助

廣告贊助

最新發布

全站最新

廣而告之

HTML5語義化標記拋棄DIV標記

曾經,設計師們經常會跟頻繁運用基於table的沒有任何語義的布局。不過最終還是要感謝像jeffrey zeldman和eric meyer這樣的思想革新者,聰明的設計師們慢慢的接受了相對更語義化的 div 布局替代了table布局,並且開始呼叫外部樣式表。但不幸的是,複雜的網頁設計須要大量不同的標籤...

標記永久化

標記永久化是線段樹的乙個技巧,常用於無法 或難以 進行 pushdown 的較複雜的資料結構如主席樹,樹套樹等。如何做?對每個節點維護 sum 和 add 考慮修改,當詢問與當前區間重合時,更新 add val 對所有經過的區間 sum val cdot r l 1 void modify int ...

標記永久化

1 概述 在可持久化線段樹中,我們常常要使用區間修改操作。這時候,如果再用下傳標記再向上更新的方式 pushdown pushup 來實現就會變得十分麻煩 因為要可持久化嘛 那麼,有沒有一種實現線段樹區間修改的方式可以不用下傳標記或向上更新呢?有,那就是標記永久化。2 原理 標記永久化的原理簡單來說...