為什么要拆分樣式文件?
更易于查找樣式規(guī)則. 簡化維護,方便管理. 還可以針對某一頁面提供特定的樣式.
為什么要添加橋接樣式?
你可以隨時添加或移除樣式而不需要修改HTML 文檔.
為什么要定義兩種媒體類型?
NN4 不支持@import ,故識別不到橋接樣式.
@import ‘header.css’;
@import ‘content.css’;
@import ‘footer.css’;
@imports 如何工作?
它將所有CSS 規(guī)則從一個文件導(dǎo)入到另外一個文件.@import 不能被老的
瀏覽器所識別.
對于 大型站點 來說,這是一個理想的概念.
Hack-free CSS
處理諸如IE 這樣煩人的瀏覽器 的兼容性是我們最頭疼的事兒之一.
很多朋友使用CSS Hack 來解決這些問題.
問題是當IE版本進行升級更替,改進對CSS的支持后,之前使用的hacks將會無效 !
你是怎么解決這個問題 的呢?
“我們要求你在不使用CSS hacks 的情況下更新你的頁面.假如你想針對IE或者避開IE,你可以使用條件注釋.”
條件注釋 如何工作?
步驟一、針對IE,創(chuàng)建一個心得樣式文件
步驟二、在HTML文檔的開頭添加條件注釋 代碼
只有指定的IE瀏覽器版本識別這個心的樣式,其它的瀏覽器將會徹底忽略 它.
平常的瀏覽器識別:(非IE瀏覽器,如火狐、Chrome等等)
特定IE 版本識別:
舉個例子, 大多數(shù)瀏覽器會將補白加進容器的寬度里,但是IE5 不會. 這種情況下,IE5 顯示的是一個比較小的容器.
main.css (被包含IE5在內(nèi)的所有瀏覽器識別):
#container{ width: 600px; padding: 100px;}
ie5.css (只有IE5識別):
#container {width: 800px; }
為什么條件注釋是一個好的解決方案呢?
1. No hacks
特定的CSS 規(guī)則僅出現(xiàn)在新的樣式表里.
2. 文件分離
針對特定版本的IE 定義的樣式脫離了主樣式表,可以在IE 瀏覽器升級更新對屬性支持時輕松移除這些文件.
3. 針對性
可對不同版本的IE 瀏覽器有針對性的進行相關(guān)屬性的定義。