首頁  >  文章  >  web前端  >  在到達無H無F境界前~還是要痛苦~我相容瀏覽器的CSS_經驗交流

在到達無H無F境界前~還是要痛苦~我相容瀏覽器的CSS_經驗交流

WBOY
WBOY原創
2016-05-16 12:10:091362瀏覽

對著多個解析不一樣瀏覽器是件鬱悶的事,是所有寫CSS的人都會遇到的。
雖然條件註解是一比較理想的做法,向前向後相容。可惜我不大喜歡N個版本的CSS,

先說下我的自己的用法.
初始化
Selectors{}
 保證向後相容性,
接著開始過濾
不管IE6有沒有引進Quirks Mode
都用
 * html Selectors{} 
處理IE6和以下版本,
對下再向下版本的區分我做了比較複雜的版本處理。
用讀入IE5.x

@media tty {
i{content:"";/*" "*/}} @import 'ie5x.css'; /*";}
}/* */

在特別的要求下才會用,因為IE5跟IE5.5很多方面都很像。相對笨點,
我必須加區分,是用

*>html Selectors{} 

本來應該是
*>html body Selectors{} 
比較好處理優先權的問題,

IE7對於CSS的支援已經接近FF,Opera,Safari這些瀏覽器了,但是,總會有些特別的問題,
我選擇用 
*+ html Selectors{} 
來特別處理IE7,可是當IE7也引進Quirks Mode時,問題變得很複雜的,他對CSS的認識也降到IE5,很像,又有不一樣滴,我想沒找到解決的方式,所以我打死也不把IE7引進Quirks Mode

FF也不是標準的。
@namespace url(http://www.w3.org/1999/xhtml);
@-moz-document url("http://www.loaoao.com") {
Selectors{ ... !important} 
}

Opera 呢。 雖然透過ACID2 
可在我無聊的的寫法下~依然有問題像這樣的 li:hover+li {} 不知道下 不知道下 不知道下 下 下〔下 下 住下沒有下 重生一樣個發布版本會不會解決
還好別人提供了

@media all and (min-width: 0px){
Selectors{}
}
我不知道到底會出現多少的問題。多過濾的方式可以參考http://centricle.com/ref/css/filters/ 


不管是用hack還是filter 都是痛苦的
解決今天的問題不是為了生產明天的問題。

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn