很多前端WEB效果在主流瀏覽器是沒有問題的，我們現在寫代碼都愛用CSS來解決原本需要用JS、jQuery的效果。網站設計希望在SEO方面表現優(yōu)秀就減少JS的依賴，這是因為這些文件都比較大，影響加載時間。而瀏覽器兼容性也是一個麻煩事，其實只要習慣了，開發(fā)難度就會減少許多，比如：采用通用性好的HTML標簽；判斷用戶的瀏覽器而外調用不同的CSS、JS等方法，避免全部都加載等方法都值得大家研究。

       比如網頁的自適應頁面，設計元素在不同的設備瀏覽或者用戶改變了瀏覽器可視寬度的CSS樣式的過度改變就用到CSS3的過度效果，但是IE家族的瀏覽器就不那么友好了，解決辦法還是有，先下載一個文件

鏈接：http://pan.baidu.com/s/1nv5jh1J 密碼：uri6

       把ie-css3.htc下載下來，htc只有IE才認它，至于工作原理就不啰嗦了，SEOer只解決用戶體驗問題就行了，感興趣的也不攔著你去研究。

使用方法

.box {
  -moz-border-radius: 15px; /* Firefox */
  -webkit-border-radius: 15px; /* Safari 和 Chrome */
  border-radius: 15px; /* Opera 10.5+, 以及使用了IE-CSS3的IE瀏覽器 */

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

  behavior: url(ie-css3.htc); /* 通知IE瀏覽器調用腳本作用于'box'類 */
}

問題和必要的說明

       畢竟不是瀏覽器自帶的屬性，使用時遇到問題在所難免，這里說一下一些注意事項，也可以說是方法的局限性吧：

1.當前元素一定要有定位屬性，像是position:relative或是position:absolute屬性。

2.z-index值一定要比周圍元素的要高；