我們有一個需要在IE6,7,8中工作的項目。過載級聯樣式表
我對樣式表沒有經驗,但是我知道根據瀏覽器類型有多種方式來加載樣式表。
我的問題是,是否有可能擁有所有瀏覽器將使用的主樣式表,然後導入一個覆蓋各種樣式以考慮瀏覽器實現的額外的樣式表,還是我需要每個瀏覽器只有一個CSS當需要完成解決方法時,它將具有大部分相同的代碼。
也許我最近一直在做過多的OO,我已經習慣了我很好的繼承等
我們有一個需要在IE6,7,8中工作的項目。過載級聯樣式表
我對樣式表沒有經驗,但是我知道根據瀏覽器類型有多種方式來加載樣式表。
我的問題是,是否有可能擁有所有瀏覽器將使用的主樣式表,然後導入一個覆蓋各種樣式以考慮瀏覽器實現的額外的樣式表,還是我需要每個瀏覽器只有一個CSS當需要完成解決方法時,它將具有大部分相同的代碼。
也許我最近一直在做過多的OO,我已經習慣了我很好的繼承等
沒有我知道的網站實際上爲每個瀏覽器手動保留不同版本的CSS文件。通常,它們只保留主樣式表和子樣式表,如第一種情況,但是使用腳本將它們合併到一個靜態文件中。維護每個瀏覽器的的所有 CSS樣式的不同副本是不值得的麻煩。
你列出的都是有效的,並且有自己的優勢的方法有兩種:
主樣式表與子樣式表對每個瀏覽:這種方法是簡單和正常工作。
合併的主樣式表和瀏覽器特定的樣式傳播:這種方法非常適合大(我的意思是大)網站有很多請求:(例如雅虎,它有這個CSS文件,接受查詢字符串來合併CSS文件);優點和缺點基本上與上述相反。
我建議您只選擇第一個解決方案,除非您的網站非常大;用PHP和服務器端瀏覽器檢測,代碼可能是這樣的:
echo "<link rel='stylesheet' type='text/css' href='/css/main.css' />\n";
$browser = get_browser(null, true);
$browser = $browser['browser'];
if ($browser == 'Firefox') {
echo "<link rel='stylesheet' type='text/css' href='/css/firefox.css' />\n";
} elseif ($browser == 'Internet Explorer') {
...
請注意,這是最好的,如果你的設計不需要瀏覽器特定CSS的。大多數情況下,這不是必需的,並且是由對CSS屬性的錯誤理解造成的。要修復較小的默認瀏覽器差異,CSS庫(例如YUI reset)可能會非常有幫助。
我肯定會走的樣式表的級聯自然優勢。
我會包括一個base.css
,然後如果你想,可以在每個瀏覽器的基礎上添加一個樣式表。
但是,我不會推薦它。一般來說,你可以讓IE6 + 7玩球而不需要不同的樣式表。
但是,如果您不能,請查看conditional comments。