您現在的位置是:電腦技術吧?>? 故障問題 ??>??什么是兼容性問題,怎么處理兼容性問題??>??正文詳情

什么是兼容性問題,怎么處理兼容性問題

酒芬馥2019-11-18 11:40:36 人圍觀
簡介此程序存在兼容性問題過去,在制作網頁時,只考慮IE6和FF的兼容性。公司改變了,要求也很高。FF和IE 678應該完全兼容。當單獨遇到hackeie8的時候。當然,使用注釋非常方便如何解決軟

以前做網頁的時候,只考慮 IE6 和 FF 的兼容性,公司換了,要求也高了,FF和IE 6 7 8 要全兼容了,碰到要單獨Hack IE8的。

當然,用注釋非常方便,只要添加相應的注釋就可以解決。

但問題是,為了一句CSS寫多一個文件,或者在header上添加注釋,那顯然不是懶人的習慣做法。

結論如下:selector{ property:value; /* 所有瀏覽器 */ property:value9; /* 所有IE瀏覽器 */ property:value; /* IE7 */ _property 當然,注意順序。

根據CSS的優先性,上面的寫法,分別針對Firefox、IE8、IE7和IE6顯示值。

讓我們看看這個:CSS代碼如下:p.ie{ height:60px;text-align:center;line-height:60px;border:1px dashed #bbb;background:#f7f7f7;font:15; color:blue; // 所有瀏覽器 color:brown9; // 所有IE瀏覽器 color:red; // IE7 _color:green; // IE6 }HTML 代?:body style=width:500px;margin:0 auto;p class=iespan style=display:block;display:none9;嘿嘿,小子竟然也用Firefox,藍色文字。

/span!--[if IE 8]不錯不錯,挺先進的嘛,使用IE8呢!文字是褐色的。

![endif]--!--[if IE 7]你,IE7,紅色文字!![endif]--!--[if IE 6]孩子,雖然顯示的是綠色文字,不過,IE6可不是好東西呢!![endif]--/p/body注意下面介紹的這些hack寫法僅適用于XHTML1.0。

如果沒有在HTML最前加上!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtdhtml xmlns=http://www.w3.org/1999/xhtml那么效果將不一樣!此外,這里所說的IE8,不是指IE8的兼容模式,因為IE8的兼容模式其實就是IE7。

區別IE6、7與FF/IE8:background:blue;*background:orange;引用顯示效果:IE 6/7:orangeFF/IE8:blue原理:FF/IE8不支持*開頭,而IE6/7都支持。

區別IE6與IE7/IE8/FF: background:green;_background:blue;引用顯示效果:IE7/8/FF:greenIE6:blue原理:IE6支持下劃線_,IE7、8和firefox均不支持下劃線。

區別FF/IE8和IE6/7:background:orange; background:green;-background:blue;或者background:orange;*background:green!important;*background:blue;引用顯示效果:IE6:blueIE7:greenFF/IE8:orange原理:IE6能識別-,IE7能識別 ,IE8和FF都不能識別 和-IE8/FF都不識別*,IE7優先識別!important,IE6不能識別!important。

關于IE8的hacks:.test{ color:/***/#00f9; /* IE8 only */color:#00f9; /* 適用于所有IE版本 */ }可同時區分IE8、IE7、IE6、Firefox的CSS hacks:.test{color:#000; /* Firefox */color:/***/#00f9; /* IE8 */*color:#f00; /* IE7 */_color:#0f0; /* IE6 */}添加相應的注釋解決兼容性問題注釋相應的Css文件:link rel=stylesheet type=text/css href=css/style.css media=screen /!--[if IE 6]link rel=stylesheet type=text/css href=css/IE6style.css media=screen /![endif]--!--[if IE 7]link rel=stylesheet type=text/css href=css/IE7style.css media=screen /![endif]--!--[if gte IE 8]link rel=stylesheet type=text/css href=css/IE8style.css media=screen /![endif]--注釋相應的Css 內容:!--[if ie 6]style!--#warp{ padding-bottom:11px;}--/style![endif]--!--[if ie 7]style!--#warp{ padding-bottom:11px;}--/style![endif]--!--[if ie 8]style!--#warp{ padding-bottom:11px;}--/style![endif]--

版權聲明:本文由 酒芬馥 整理編輯。

原標題:兼容性,常見兼容性問題

轉載注明出處:http://www.dn9ww09s.icu/fault/13490.html

文章評論

    共有條評論來說兩句吧...

    用戶名:

    驗證碼:

作者推薦

  • 心悅會員首次激活在哪,心悅v1在哪開通

    心悅會員首次激活在哪,心悅v1在哪開通 相關圖片手機上qq心悅會員圖標新悅會員是指騰訊游戲2011年推出的高端服務俱樂部會員,可享受優質的私人服務特權和尊貴的游戲特權。因為新悅會員可以享受很多游戲特權和優惠,很多玩家都...

  • 網頁打印技巧,網頁制作技巧

    網頁打印技巧,網頁制作技巧 相關圖片實用的在線網頁版工具技巧了解CSS層疊樣式表(CSS)是一組控制網頁內容外觀的格式規則。當使用CSS格式化頁面時,內容和演示文稿是相互獨立的。頁面內容(HTML代碼)位于自己的HTM...

  • wpsppt圖片自動播放設置,wps演示文稿如何自動播放

    wpsppt圖片自動播放設置,wps演示文稿如何自動播放 相關圖片wps怎樣設置幻燈片放映時間WPS演示憑借其強大的功能受到很多小伙伴的喜愛,所以很多人都說不知道如何設置WPS幻燈片的自動播放?如何刪除或替換WPS幻燈片?現在,超人軟件小編將為...

  • 全屏,怎么全屏

    全屏,怎么全屏 相關圖片電腦全屏截圖HTML5全屏(full screen)API詳細介紹了越來越多的真實web應用程序,JavaScript變得越來越強大。全屏API是一種新的JavaScrip全屏輸入...

  • 2019哈羅單車收費標準,哈羅單車app下載

    2019哈羅單車收費標準,哈羅單車app下載 相關圖片哈羅單車怎么加盟自從哈羅單車與永安行合并之后,路上的哈羅單車越來越多了,用戶的騎行也越來越方便。那么哈羅單車怎么收費?支付寶怎么免押金騎哈羅單車呢?下面,就跟著超人軟...

  • quik如何添加文字,quik保存不了

    quik如何添加文字,quik保存不了 相關圖片quik為什么只有幾秒Quik是一款非常好的視頻制作軟件,相信有很多小伙伴都想用自己的音樂作為背景音樂。那么Quik如何添加背景音樂呢?現在,超人軟件編輯也想介紹一下如何使用Quik...

  • 平面轉三維,從后期轉平面

    平面轉三維,從后期轉平面 相關圖片如何自學ui設計樂天 衛理公會教徒@斯圖:有時候當你做UI的時候,你真的看到了天賦。你知道很多不是設計專業的設計師。經過半年的自學,你開始工作了。在不到一年的時間里,這是...

  • 金山詞霸無法屏幕取詞,金山詞霸屏幕取詞不顯示翻譯

    金山詞霸無法屏幕取詞,金山詞霸屏幕取詞不顯示翻譯 相關圖片金山詞霸如何取詞金山詞霸以其專業的翻譯能力深受人們的喜愛。最近,金山詞霸的很多用戶都說不知道金山詞霸是如何在屏幕上選詞的?金山詞霸如何導入生詞?接下來,超人軟件編...

  • 頁面跳轉,頁面升級跳轉

    頁面跳轉,頁面升級跳轉 相關圖片頁面訪問跳轉緊急大通知最近,我一直在做交互規范總結的工作。在梳理頁面跳轉的邏輯時,發現頁面之間的邏輯關系并不能很好地結合頁面跳轉的動態效果。雖然只有幾秒鐘的切換效...

  • snapchat全濾鏡怎么找,snapchat怎么編輯圖片加濾鏡

    snapchat全濾鏡怎么找,snapchat怎么編輯圖片加濾鏡 相關圖片snapchat變臉濾鏡Snapchat是一款照片分享應用程序,它最大的特點是閱讀后燃燒。最近,許多用戶不知道如何向snapchat添加過濾器。snapchat如何提高分數?現在,是超snapchat調出更多特效...

熱評文章

  • 錘子m1,錘子m1參數

    錘子m1,錘子m1參數 相關圖片錘子M1是一款由hammer technology推出的智能手機。最近,很多M1的用戶表示,他們不知道如何檢查M1的功耗以及如何打開開發者選項。接下來,超人軟件將為錘子m1l拆機...

  • excel里怎么做下拉菜單,07excel下拉菜單怎么做

    excel里怎么做下拉菜單,07excel下拉菜單怎么做 相關圖片excel一級下拉菜單怎么做我們通常使用Excel來記錄表格數據。事實上,excel功能強大,并具有其他有趣和實用的功能。例如,許多人已經看到了Excel的下拉菜單,但是他們不知道怎么做1e...

  • HTML語義化,HTML語義化的理解

    HTML語義化,HTML語義化的理解 相關圖片html語義化標簽有哪些家里有一個熊孩子,經常會發生一些意想不到的事情:當他回家時,他會過來對臭爸爸哭笑不得;當你讓他穿上鞋子時,他會把鞋子抬起來扔到樓下孩子的世界里。...

  • 楊虎圍匡是什么意思,四上四下是什么意思

    楊虎圍匡是什么意思,四上四下是什么意思 相關圖片processon教程Processon是一個在線思維導圖制作平臺。您可以直接使用processon online構建思維導圖、流程圖和其他內容,而無需下載。這是一個非常強大和易于使流程圖processon導出...

  • 圖形元件,怎樣創建圖形元件

    圖形元件,怎樣創建圖形元件 相關圖片圖形元件的作用同步一天的客戶要求您在網站的頁面上創建公司角色徽標。您可以使用多個關鍵幀和修補動畫沿引線設置其角色(嵌套在組件中)的動畫,將其作為最終版本提供給客戶...

  • 12306 常用聯系人上限,12306常用聯系人上限是多少

    12306 常用聯系人上限,12306常用聯系人上限是多少 相關圖片12306添加常用聯系人在購買火車票和高鐵車票時,出于安全考慮,我們將使用12306官方應用程序購買車票。為了方便起見,想買票的小伙伴通常會加入普通聯系人一起買票。但是,需要注...

  • 酷炫的網站,國內酷炫的網站

    酷炫的網站,國內酷炫的網站 相關圖片酷炫在HTML5出現之后,它以炫目華麗的視覺效果吸引了人們的眼球。許多令人驚奇的想法很容易實現。今天,我們收集了21個獨特的HTML5 CSS3網站來展示你的膝蓋。炫酷網站設計...

  • datauser是什么意思,userdata是什么文件

    datauser是什么意思,userdata是什么文件 相關圖片91userdata是什么意思用戶數據是指用戶數據,它是計算機中的系統文件之一。如果刪除UserData生成的XML并再次打開頁面,JS將報告無效數據UserData數據是由計算機操作生成的五件套里userda...

  • 指針的用法,this指針的用法

    指針的用法,this指針的用法 相關圖片C 指針如何使用C 的指針?在C 中,指針的使用頻率更高。對于C 中大量的指針用法,有必要搞混。今天,綠茶編輯器總結了指針在C 中的用法,并將其呈現給大家,希望c語言指針用法...

  • 網易云分享歌曲短視頻,網易云視頻怎么下載到本地

    網易云分享歌曲短視頻,網易云視頻怎么下載到本地 相關圖片網易云課題網易云音樂不僅可以聽歌曲,還具有有趣的短視頻功能。如何下載網易云音樂短片?現在,超人軟件編輯將介紹如何下載網易云音樂短片,希望對您有所幫助!網易云音樂短...

關注微信

变脸官网查询