前端設計建議多用 ul dt dl 等元素，少用 div 嗎？
我們這的一個小女孩，經常用 dt dl dd 元素，我要她替換成 div，她說，前端設計建議這麼做，多用 ul dt dl 等元素，少用 div。有這種說法嗎？
用標籤看個人理解，div和span確實沒有語義，
也確實推薦用過有語義的標籤，但到了具體的場景中，
要根據上下文以及個人理解來定，沒有標準答案
@依雲 IE7以及IE7以下版本IE瀏覽器不支持:after之類的偽類
我實在忍不住來回答這個問題了，因為之前專門寫過一篇關於語義化的文章。http://www.smallni.com/?p=146
標籤語義化：用合理HTML標記以及其特有的屬性去格式化文檔內容
基本所有的html標籤都是一個單詞或者片語的縮寫，這樣其實本意是更便於我們對語義化的理解。其實所有的(x)html標籤中，除 了&和&2個無語義的標籤，其他標籤都有它存在的意義，只有知道有哪些標籤，以及對各個標籤的本義做一個了解 才能知道去用它。你不知道何時用&
標籤 原單詞 說明 語義化(Y/N)
h1-h6 head 定義 HTML 標題 Y
p paragraph 定義段落 Y
ul unordered list 定義無序列表 Y
ol ordered list 定義有序列表 Y
li list item 定義列表的項目 Y
dl definition list 定義定義列表 Y
dt definition term 定義定義列表中的項目 Y
dd definition description 定義定義列表中項目的描述 Y
table table 定義表格 Y
thead table head 定義表格中的表頭內容 Y
tbody table body 定義表格中的主體內容 Y
th table head cell 定義表格中的表頭單元格 Y
tr table row 定義表格中的行 Y
td table data cell 定義表格中的單元 Y
a anchor 定義錨 Y
img image 定義圖像 Y
div division 定義文檔中的節 N
span span 定義文檔中的節 N
如果在一個頁面中看到的基本全是div，那麼說明你對語義化標籤的使用還不是很明白：明明是一個標題，可以用& 標籤是否更語義？ 非語義化的實現方式：http://ued.ctrip.com/blog/wp-content/uploads/2011/11/no_emantic_html.html
語義化的實現方式：http://ued.ctrip.com/blog/wp-content/uploads/2011/11/emantic_html.html
在html5未誕生之前，我們可以用&或者&來做一些模塊的架構，要知道何時用&&，&是 division的縮寫，為區塊、間隔的意思，和&，我們在做一個無語義的架構時就可以用到&或者&(用於行內)。
從今天看來語義化的好處已逐漸明朗和開放開來：
手持移動設備的無障礙閱讀
手持移動設備如PDA、智能手機等可能對CSS的解析能力較弱，這時可能就需要更語義的標籤來體現一個頁面的易讀性
盲人等一些障礙人士的閱讀
屏幕閱讀器對不同標籤所發出的聲音是不同的，使用更語義的標籤以能傳達不同信息的重要性
搜索引擎的友好收錄
雖然各大搜索引擎的排名規則不斷的再變化，但規則里的正則始終是要匹配標籤的，如果能用更語義的標籤，蜘蛛爬行能夠根據標籤的使用來確定上下和各關鍵字的權重。
技術趨勢所趨
正如html誕生時的初衷那樣，各個標籤的本義就是希望能在特定的地方使用合適的標籤，而不是去用樣式來表現一個不語義的標籤。html5新增了更多的語 義化的標籤，原本用&&來實現的結構，通過html5的&
最後要說的是，是因為你不了解其他的標籤才會去濫用&，這也是由於當初從&
html還有很多其他的標籤，每個標籤誕生時都是有它存在的理由的，建議好好去詳細了解下http://www.w3school.com.cn/tags/html_ref_byfunc.asp
但必須要提到的一點是 ：前端技術上永遠沒有銀彈，你需要在合適的地方選用合適的標籤，而不是一味追求所謂的「語義化」。濫用&
什麼 div 啊 span 啊最討厭了，段落你用 p 啊，引用用 q 和 blockquote 啊，強調用 em 和 strong 啊，術語定義用 dl 啊，無序列表是 ul 有序列表 ol 啊，文章叫 article，導航叫 nav，你要分節？section！按鈕用 input[type=button] 啊，像鏈接的你也可以用 a，但別用 span 啊，也別忘記設置 href 屬性，不然 a 退化成了 span 啊。
還有，裝飾性的東西盡量別一層層 div 啊，:before 和 :after 很強大啊有木有啊？http://css-tricks.com 簡直把這兩個用神了有木有啊！
補：我也不知道為什麼我的答案被頂到最前邊了。也許是因為我這答案比較適合提問者的語氣？
好吧，簡單的說，不引起麻煩（其它部分要大改）的前提下，盡量選擇語義最接近的標籤。這其實和知乎的話題差不多。你看，現在問題的「DIV+CSS」、「CSS」就很好，要是只給一些諸如「前端開發」、「網站開發」之類的話題標籤效果就差一些了。或許你們說的都是『HTML 語義化』的問題。通俗來講，HTML 語義化就是指把標籤用在它該用的地方。
如果網頁的某一部分需要列表，那當然可以用 ul / dl 等標籤，也推薦這樣做。但是如果只是一個普通的區域，用 ul / dl 顯然是不合適的。語義化不是用其他標籤完全取代 div 標籤。HTML元素要做的語義化，沒有多用或少用某個元素的定義，而是恰當地應用在適合它表達語義的地方，這就像遣詞造句一樣了。個人認為，要真正做到網站語義化，就好比一篇優秀文章的結構，不能是一些語句的堆砌。如果開發人員為了自己的便利而一味地採用DIV那讓懂HTML語義化的前端人員情何以堪？不過話又說回來，網站語義化在國內就像浮雲，大多數就停留在理論階段，卻很少考慮網站語義化的意義。
關於標籤的使用，沒有絕對的。
首先我想問下提問者，你讓她用div是什麼原因？如果你不能拿出合理的科學性解釋，那我覺得，她有自己代碼的習慣，用其他的標籤也沒有問題。
另外，標籤的語義化本來就是在不斷擴展的，早期的標籤主要是為了「呈現數據」使用，而並沒有給太多東西適應商業性網站。打個簡單比方，一個電子商務網站如果想在商品圖片上使用「促銷」這個標籤，一般是使用一個span。但是為什麼不能用&
此外，不太認同前面某位同學裝逼的說法。聞道有先後，術業有專攻。你js很厲害，不代表只會css就是sb。
其實都用div也行,,,,,現在的搜索引擎也都很智能,而且不符合標準也不會死人,看豆瓣的阿爾法神馬的......不過最好還是帶點語義哦,可以裝逼哦
div和span就像OO系編程語言中的Object，它什麼都是，但又什麼都不是，你可以很靈活地用它來擺出各種銷魂的姿勢，但它最大的缺點就是語義不明，這讓機器閱讀很頭痛。
前端的界面開發使用div+css確實也可以很方便的開發出精美的頁面，完成大部分工作，但我個人覺得一個精美的產品不僅僅要有外在美，內在美也很重要，而語義化標籤也能夠體現出產品的內在美。
大家都知道，其實HTML就是一份特殊的文檔（或者說它是文檔的一種特殊的表現形式），所以它也可以像常規的word文檔一樣有大標題、小標題、段落、列表、引用等一系列傳統書寫標準。只是在word文檔裡面的這種語義標準化是為了讓人更好的閱讀和理解，而一份好的HTML文檔不僅要考慮給人類讀，還要對機器閱讀友好。使用css對HTML進行排版美化和可以增強人的閱讀和理解，但它解決不了機器閱讀的問題，所以還是需要在標籤上做文章，使標籤根據內容為自己賦予某種意義。
其實大家都明白語義化標籤的重要性，可是我們大多數前端攻城獅在開發的時候都會自然而然的傾向於直接用div+span，而不使用語義化標籤，這又是為啥捏？個人覺得主要有以下幾個原因：- 語義很難去判定或懶得去判定
- 為了符合設計風格需要重置很多默認樣式
- 需要去記憶和辨識更多的語義化標籤
- 語義化標籤是比較重要，但對於功能實現來說確並非必要
所以對於是否使用語義化標籤，我個人的建議是：
- 比較穩定的網站功能頁面（如：網站首頁、各子頻道頁、關於頁、站點地圖等）儘可能的使用語義化標籤，這一點的投入對你的網站後續的運營和維護會有很大的幫助。
- 臨時性的頁面（如：有時效性的活動運營頁、互動娛樂頁等）可以不用語義化標籤，甚至有的公司就直接使用工具生成的一大堆div+css+image的頁面。當然可以的話使用語義化標籤也是極好嘀。
個人觀點，歡迎拍磚 ^_^ ~
在特定的地方用適合的標籤
大體上是這樣的，但是不準確。
實際運用根據內容來，如果是列表性質的最好用ul或者dl。
合理的嵌套，會帶來布局上的便利性。
我喜歡用div和span，因為這兩個元素本身不含任何語義，就如同一張白紙，人人都愛白紙！
兩者用途差異挺大，看具體情況，一般來說，用語義更準確的容器，如&
&新建行，而不是&
換行，&
推薦閱讀：