針對不同瀏覽器創建的不同網頁文件

在我看來，過去十年中，所有關於HTML/CSS的書籍總是談論瀏覽器不兼容問題，以及如何通過向CSS，JS添加更多「黑客」來解決該問題，或HTML。爲什麼他們從不建議用另一種方式處理這個問題（我相信最好的方法）是在html文件的第一行添加代碼（php，c，whatever），檢測哪個瀏覽器正在被使用，然後添加適用於該瀏覽器的CSS/JS文件？針對不同瀏覽器創建的不同網頁文件

來源

2009-05-26 user104568

這是因爲服務器/客戶端的分歧。無法從運行在服務器上的代碼檢測客戶端設置。

HTML中有條件註釋，允許您加載替代CSS或Javascript文件，如果您願意的話。

A Quickie reference on Conditional Comments

來源

2009-05-26 22:59:06

解決方案可以在頭 – 2009-05-26 23:00:42

這是真正的閱讀的用戶代理，但我從來沒有能夠依靠它。但瀏覽器檢測從來沒有完全證明。 – 2009-05-26 23:02:46

直到最近，Opera默認會假裝爲IE瀏覽器，以避開已明確限制每個瀏覽器而不是IE瀏覽器的網站。現在這不是什麼大問題，但它確實突出了取決於用戶代理字符串的缺陷。 – 2009-05-26 23:04:42

因爲那麼你必須維護兩套CSS和JS文件。這與向其中一個添加「黑客」並沒有什麼不同，除非您在任何時候進行更改時都必須對兩個文件進行更改。

來源

2009-05-26 22:59:53

爲了進一步馬修藤說，有條件的意見看起來有點像這樣...

<!--[if lte IE 6]><link href="LayoutIE6.css" type="text/css" rel="stylesheet" /><![endif]--> 
<!--[if gte IE 7]><link href="LayoutIE7.css" type="text/css" rel="stylesheet" /><![endif]--> 
<!--[if !IE]><link href="Layout.css" type="text/css" rel="stylesheet" /><![endif]-->

希望這有助於:)

來源

2009-05-26 23:02:25

這是因爲（在大多數情況下與「傳統」偶） CSS hackery由前端開發人員實施，他們並不總是可以訪問後端腳本。如果網絡開發早期是由後端開發人員推動的，我經常會認爲事情會有很大的不同。

我不認爲這是一個壞的問題（因爲某種原因最初被拒絕）。而且，爲了紀錄，像jQuery這樣穩定的JS框架的CSS &的條件註釋絕對是必須的。

來源

2009-05-26 23:04:59 da5id

在過去，您會在JavaScript中添加黑客來確定客戶端正在使用哪個瀏覽器並基於該瀏覽器運行代碼。看起來好像沒有一個決定最好的方式去做，所以每本書都有自己的實現。

你會在很多舊書代碼中找到確定瀏覽器，然後在整個代碼，你會看到這樣的事情：

if (NS4) { 

} elseif (IE) { 

}

但在很大程度上，現在是過時了。

我們現在擁有的另一件大事就是像JQuery這樣的框架，它可以抽象出一些仍存在的不兼容問題。在我看來，過去人們只會推出他們自己的風格的JQuery-esq框架，所以沒有一個統一的框架被更大的社區所接受。來到

我的一個關於用戶代理字符串喜歡引用的Chrome發佈：

「，因此Chrome的使用WebKit的，並假裝Safari和WebKit的謊稱自己是KHTML和KHTML 假裝壁虎，和所有瀏覽器僞裝成Mozilla和鉻稱自己的Mozilla/5.0 （的Windows; U; Windows NT的5.1; EN-US）爲AppleWebKit/525.13（KHTML，像壁虎）鉻/ 0.2 .149.27 Safari/525。13，和用戶代理字符串是一個完整的一塌糊塗，和近沒用，每個人都假裝其他人，並混亂盛產「

這是一個很好的喜劇看的 - http://webaim.org/blog/user-agent-string-history/

來源

2009-05-26 23:06:44

如果您使用純瀏覽器檢測，則每次發佈新瀏覽器或瀏覽器版本時都需要更新您的列表，這會導致出現荒謬的情況，例如新版本的用戶被告知升級降級爲較舊版本

瀏覽器不一致應該通過測試功能來處理。正如其他人所說，有像JQuery這樣的JavaScript框架可以爲您處理這個問題。關於CSS，使用條件註釋來定位其他人提到的舊版Internet Explorer。儘量避免使用「黑客」，因爲他們可以修復更新的版本，而無需解決您試圖解決的問題。

來源

2009-05-26 23:13:09 Scott

我認爲這是一個更好的解決方案：

簡單的解決方案，只是用這個JS庫，你可以很容易地應用樣式爲每個瀏覽器/操作系統組合：

BrowserClass.js

有了這個，你會使用當前的名稱和瀏覽器版本在使用的操作系統上獲取正文標籤上的類名稱。

之後包括文件：

<script src="js/browserclass.js"></script>

例如在Windows 8.1中使用最新的Chrome，你會看到：

<body class="chrome chrome34 win desktop">

而且在樣式文件中，你可以參考：（.sass造型）

body.chrome 
    #example 
    color: blue

或

body.win.chrome 
    #example 
    color: red

注：

[如果IE]語句，因爲IE10過時，所以這是對於

來源

2014-04-15 20:45:10

針對不同瀏覽器創建的不同網頁文件

回答

相關問題