先上示例，攜程首頁酒店模組的效果圖如下：
**結構如下：
<dl>
<
dt>酒店
dt>
<
dd>北京
dd>
<
dd>上海
dd>
dl>
<
ul>
<
li>北京酒店列表
li>
<
li>北京酒店列表
li>
<
li>上海酒店列表
li>
<
li>上海酒店列表
li>
ul>
這種結構在顯示上沒有任何問題，切換城市時下面的列表會相應改變。但當無法正常載入css時顯示效果就比較杯具了，截圖如下：
dt>北京
dt>
<
dd>
<
ul>
<
li>北京酒店列表
li>
<
li>北京酒店列表
li>
ul>
dd>
dl>
<
dl>
<
dt>上海
dt>
<
dd>
<
ul>
<
li>上海酒店列表
li>
<
li>上海酒店列表
li>
ul>
dd>
dl>
這樣當頁面出現no css的時候顯示效果就比較接近真實需求：
到這裡就離成功不遠了，接下來的問題是如何用現在的 dl, dt, dd 實現想要的視覺效果。
1. 先給所有 dl 的外層 div 加樣式：position: relative，再給 dd 設定 position: absolute，這樣列表就可以脫離 dl 的文字流了，切換列表時保證它們顯示在同乙個位置；2. 城市橫排顯示，這時設 dl 為浮動 float: left，再重新整理果然橫過去了。不過現在笑還早了點，不要忘了還有那萬惡的 ie6 要相容：給 dt 設定浮動並轉行內元素，否則會有多餘的空隙 float: left; display: inline; 再重新整理就ok了；
3. 補充一點為什麼要在 dd 中加 ul，這要視頁面結構而定，每一條除了標題還有**，還有個需要轉化的人民幣符號 ¥，如果直接用 a 鏈結就需要大批量行內轉塊元素，比較耗效能。最初想用多個 dd，但因為有絕對定位的原因列表會重疊在一起，所以更換方案。
SEO名言解讀 細節決定成敗的
在seo行業有很多很經典的話語，比如 lgpsvldquo 內容為王 外鏈為皇 精做內容 廣布外鏈 執行力第一 不要太關心 細節決定成敗 等等，這些說法都是濃縮的經典，暫時都還是真理，但是執行到位的就那麼幾個。今天來談談 細節決定成敗 這句話。這可是句名言，是生活工作中通用的真理，單純放在seo裡面...
細節決定ERP專案啟動會的成敗
細節決定erp專案啟動會的成敗 說明 本篇文章版權由ecf和hp所有。參加了某企業的erp專案啟動會議，由於前期準備的不太充分，所以整體上來說erp專案啟動會開的也不成功，所以不妨從乙方的視角來總結一下問題及誤區，從而實現。專案啟動會的意義 作為雙方專案團隊的第一次正式見面，應該統一雙方對於專案目標...
細節決定成敗 Web設計的5個要點
排列 整潔的設計的第一關鍵就在於對齊，包括水平和垂直對齊。隨隨便便地排列網頁元素的話是無法創作出整齊 一致的感覺的。這也是你的 是否專業 優秀的關鍵。良好的排列會讓你的 看起來更有層次感。向 新增影象和文字時要注意網頁元素是如何在頁面上排列的。每個專案的頂部是否在一條直線上？或者專案的底部是否在一條...