1. 程式人生 > >關於相容ie8的圓角和select下拉列表

關於相容ie8的圓角和select下拉列表

首先處理下border-radius在ie8下的相容問題;

因為這個屬性是css3中的,ie8根本不知道你是誰好麼?那我們就得找辦法了,經過我千辛萬苦的百度和google去解決它,總結下來感覺就這個方法比較好用;

那就直接上程式碼了,一木瞭然:

<!DOCTYPE html>
<html>
<head>
<title>圓角</title>
<style type="text/css">
.box{
width:200px;
height:200px;
line-height: 200px;
background:blue;
border-radius:50%;
text-align:center;
}
.box {
  -moz-border-radius:100px; /* Firefox */
  -webkit-border-radius: 100px; /* Safari 和 Chrome */
  border-radius: 100px; /* Opera 10.5+, 以及使用了IE-CSS3的IE瀏覽器 */


  /*-moz-box-shadow: 10px 10px 20px #000; *//* Firefox */
  /*-webkit-box-shadow: 10px 10px 20px #000;*/ /* Safari 和 Chrome */
  /* */ /* Opera 10.5+, 以及使用了IE-CSS3的IE瀏覽器 */


  behavior: url(ie-css3.htc); /* 通知IE瀏覽器呼叫指令碼作用於'box'類 */
}
</style>
</head>
<body>
  <div class='box'>loading</div>
</body>
</html>

這個方法的關鍵是引用了ie-css3.htc的這個檔案 ;這個下載地址很好找的;放在目錄下,自行引用進來就可以了;

然後是select在ie8中的相容樣式問題,如何很好的處理select的小三角呢? loading