一些瀏覽器兼容性問題

1、select

select箭頭在各個瀏覽器顯示不一致。為了達到統(tǒng)一性。就必須去掉默認樣式,替換上自己的樣式。代碼如下:

所有主流瀏覽器都不支持 appearance 屬性。

appearance對ie、opear瀏覽器不支持。-moz-appearance支持火狐,-webkit-appearance支持safari和谷歌;

對于select::-ms-expand{}只兼容到ie10。

2、placeholder

placeholder是h5的新屬性,IE10以前的瀏覽器(8、9)不支持此屬性。

第一種方法用插件jquery-placeholder,這是借鑒別人的。有點麻煩,先記著吧

注:此插件和jquery validate混合使用時,密碼框password會略過校驗,因為新生成的input并沒有name屬性。解決方法:點擊提交按鈕時,用js代碼給新生成的input添加name屬性。。。


3、opcaity

題外記錄:opcaity屬性是用來定義透明度的,其值在0-1.0之間。但IE8及其以下的版本并不支持。

在IE8上需用filter:alpha(opacity=?)來過濾,opacity的值在0-100間。

4、box-sizing

Internet Explorer、Opera 以及 Chrome 支持 box-sizing 屬性。 ? ? ? Firefox 支持替代的 -moz-box-sizing 屬性。

-moz-box-sizing:border-box;/* Firefox */

-webkit-box-sizing:border-box;/* Safari */

假如您需要并排放置兩個帶邊框的框,可通過將 box-sizing 設(shè)置為 "border-box"。這可令瀏覽器呈現(xiàn)出帶有指定寬度和高度的框,并把邊框和內(nèi)邊距放入框中。

5、背景顏色rgba的兼容性

rgba對IE不兼容。那只能用濾鏡 ?filter: progid: DXImageTransform.Microsoft.gradient(startcolorstr=#66000000, endcolorstr=#66000000);

這個顏色“#19ffffff”是由兩部分組成的,第一部是#號后面的19,是rgba透明度0.1的IEfilter值。從0.1到0.9每個數(shù)字對應(yīng)一個IEfilter值。對應(yīng)關(guān)系如下:

第二部分是19后面的六位。這個是六進制的顏色值。要跟rgb函數(shù)中的取值相同。比如rgb(255,255,255)對應(yīng)#ffffff;都是白色。到這里,rgba的用法就可以兼容IE8了。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • 瀏覽器兼容問題一:不同瀏覽器的標(biāo)簽?zāi)J的外補丁和內(nèi)補丁不同問題癥狀:隨便寫幾個標(biāo)簽,不加樣式控制的情況下,各自的m...
    追卓2018閱讀 1,534評論 0 2
  • 問答題47 /72 常見瀏覽器兼容性問題與解決方案? 參考答案 (1)瀏覽器兼容問題一:不同瀏覽器的標(biāo)簽?zāi)J的外補...
    _Yfling閱讀 14,168評論 1 92
  • jQuery基礎(chǔ)(一)——樣式篇 1-2環(huán)境搭建 1-3 jQuery HelloWorld體驗 $(docume...
    croyance0601閱讀 1,172評論 0 8
  • 一、樣式篇 第1章 初識jQuery (1)環(huán)境搭建 進入官方網(wǎng)站獲取最新的版本 http://jquery.co...
    凜0_0閱讀 3,675評論 0 44
  • 有些玩友有疑問,買來的小葉紫檀手串戴在手上總覺得有點不對勁,要么大點,要么就小點。說能不能把手串拿下一顆珠子佩戴。...
    林遠騰博客閱讀 4,113評論 0 0

友情鏈接更多精彩內(nèi)容