摘自
長文字行難以閱讀。隨著現代顯示器的尺寸越來越大，螢幕可讀性問題變得越來越重要。緩解這個問題的一種方法是讓設計居中。居中的設計只佔螢幕的一部分，而不是橫跨螢幕的整個寬度，這樣就會建立比較短的容易閱讀的行。
居中的設計目前非常時髦，所以如何在css中設計居中是大多數開發人員首先要學習的主題之一。讓設計居中有兩個基本方法：乙個方法使用自動空白邊，另乙個方法使用定位和負值的空白邊。
使用自動空白邊讓設計居中
假設有乙個典型的布局，希望讓其中的容器div在螢幕上水平居中：
為此，只需定義容器div的寬度，然後將水平空白邊設定為auto:
在這個示例中，我決定以畫素為單位指定容器div這寬度，讓它適合800*600解析度的螢幕。但是，也可以將寬度設定為主體的百分數，或者使用em相對於文字字型大小設定寬度。
這在所有現代瀏覽器中都是有效的。但是，怪異模式中的ie5x和ie6不支援自動空白邊。幸運的是，ie將text-align:center誤解為讓所有東西居中，而不只是文字。可以利用這一點，方法是讓主體標籤中的所有東西居中，包括容器div，然後將容器的內容重新對準左邊：
body
以這種方式使用text-align屬性是一種招數，但是這個招數是無害的，對**沒有嚴重的影響。容器現在在ie以及比較符合標準的瀏覽器中都會居中。
為了讓這個方法在所有瀏覽器中都能夠順利地工作，需要做最後一件事情。在netscape6中，當瀏覽器視窗的寬度減少到小於容器的寬度中，容器的左邊會跑到螢幕的外邊，就無法訪問它了。為了防止這種現象，需要將主體元素的最小寬度設定為等於或略大於容器元素的寬度：
body
現在，如果試圖將視窗的寬度減小到小於容器div的寬度，就會出現滾動條，使使用者能夠訪問所有內容。
使用定位和負值空白邊讓設計居中
到目前為止，使用自動空白邊進行居中的方法是最常用的，但是它需要用乙個招數來滿足ie5.x的要求。它還要求對兩個元素而不只是乙個元素應用樣式。因此，有些人喜歡使用定位和負值空白邊來代替這種方法。
與前面一樣，首先定義容器的寬度。然後將容器的position屬性設定為relative, 將left屬性設定為50%。這會把容器的左邊緣定位在頁面的中間。
但是，並不希望讓容器的左邊緣居中，而是希望讓容器的中間居中。實現的方法是對容器的左邊應用乙個負值的空白邊，寬度等於容器寬度的一半兒。這會把容器向左邊移動它的寬度的一半，從而讓它在螢幕上居中：
選擇使用哪種居中技術是個人喜好問題。但是，同時掌握多種技術總是有好處的，因為不知道什麼時候某種技術正好合適。
讓CSS更規範 div和span
摘自 精通css 高階web標準解決方案 有助於在文件中新增結構的乙個元素是div元素。許多人誤以為div元素沒有語義意義。但是，div實際上代表部分 division 它提供了將文件分割為有意義的區域的方法。所以，通過將主要內容區域包圍在div中並分配id maincontent，就可以在文件中新...
css讓div永遠居中
在網上看了很多，讓div居中，有設定 float center，text align center的方式，但都不夠完美。當然，我這個方法，也是在網上搜到的，只是詳細說明一下每乙個css屬性的含義而已。css view plain copy font size 18px divcenter posit...
讓CSS更規範 招數和過濾器簡介
摘自 精通css 高階web標準解決方案 css過濾器 filter 是一種對特定的瀏覽器或瀏覽器組顯示或隱藏規則或宣告的方法。過濾器根據瀏覽器中的缺陷，比如解析bug以及未實現或錯誤地實現的css，對瀏覽器顯示或隱藏規則。css招數是一種讓瀏覽器表現得符合自己希望的不優雅的方法。css招數通常用來...