CSS瀏覽器相容解決方案

2022-07-28 12:57:18 字數 748 閱讀 2302

1.在ie8的甑別上,如何讓樣式只對ie8起作用?

用ie瀏覽器獨有的文件注釋的方式。像這樣:

doctype html>

只需要在獨立對ie8應用樣式規則的地方,copy該條規則,然後在前面加上 .ie8然後就能隨便寫了,對付ie9也一樣。

2.360雙核瀏覽器,新增以下頭部meta資訊可以使得網頁用webkit核心渲染:

表示強制要求360瀏覽器用chrome的核心渲染網頁。

3.ie8的css相容:

1.ie8支援:first-child,但不支援:last-child。因為前者是css2.1標準,後者是css3標準。注意:如果瀏覽器不支援的選擇器和支援的選擇器寫在一起,那麼整條規則就不起作用了。

2. input設定了左右padding,但輸入較多內容時padding還是會消失。方法是在input 外面套一層div,用div設定左右padding,border,width和height,input只需要設定width和weight為100% 即可。另外,如果沒有明確設定height的值,那麼設定的line-height值就是height的值,但對於ie8,如果input 設定了 line-height,那麼input必須設定height,否則input的內容顯示有問題,會上下隱藏部分內容。

3.input,img,iframe等元素不支援偽元素

4.父元素的左padding會和子元素的左margin重疊。

5.sprite圖中的icons之間最好留空白間隔,哪怕間隔1px也好。

瀏覽器相容問題的解決方案

所謂的瀏覽器相容性問題,是指因為不同的瀏覽器對同一段 有不同的解析,造成頁面顯示效果不統一的情況。在大多數情況下,我們的需求是,無論使用者用什麼瀏覽器來檢視我們的 或者登陸我們的系統,都應該是統一的顯示效果。所以瀏覽器的相容性問題是前端開發人員經常會碰到和必須要解決的問題。在學習瀏覽器相容性之前,我...

瀏覽器相容問題及解決方案

瀏覽器相容問題一 不同瀏覽器的標籤預設的外補丁和內補丁不同 問題症狀 隨便寫幾個標籤,不加樣式控制的情況下,各自的margin 和padding差異較大。解決方案 css裡 備註 這個是最常見的也是最易解決的乙個瀏覽器相容性問題,幾乎所有的css檔案開頭都會用萬用字元 來設定各個標籤的內外補丁是0。...

CSS 多瀏覽器相容性問題及解決方案

相容性處理要點 1 doctype 影響 css 處理 2 ff 設定 padding 後,div 會增加 height 和 width,但 ie 不會,故需要用 important 多設乙個 height 和 width 3 ff 支援 important,ie 則忽略,可用 important ...