【主要是針對ie6 7 8對支持和讓老瀏覽器支持html5+css3的一些js腳本】
html5shiv.js
// 讓IE8及耕地版本的IE識別section,article,nav等html5元素
cdn地址:
<script src="https://cdn.bootcss.com/html5shiv/r29/html5.min.js"></script>
注意:都要初始化新標簽的CSS.因為HTML5在默認情況下表現為內聯元素,對這些元素進行布局我們需要利用CSS手工把它們轉為塊狀元素方便布局
/*html5*/
article,aside,dialog,footer,header,section,footer,nav,figure,menu{display:block}
但是如果ie6/7/8 禁用腳本的用戶,那么就變成了無樣式的"白板"網頁,我們該怎么解決呢?
我們可以參照facebook的做法,即引導用戶進入帶有noscript標識的 “/?_fb_noscript=1”頁面,用 html4 標簽替換 html5 標簽,這要比為了保持兼容性而寫大量 hack 的做法更輕便一些。
selectivizr(www.selectivizr.com)
// 讓IE6/7/8支持 ::first-child等高級css選擇符
cdn地址:
<script src="https://cdn.bootcss.com/selectivizr/1.0.2/selectivizr-min.js"></script>
IE9.js(http://www.9416.cn/html/support/254.html)
// 修復從IE6-IE9的很多bug和缺損功能
CSS3Pie(www.css3pie.com)
// 讓IE6-IE9支持圓角,背景漸變,邊框圖片,盒子陰影,RGBa顏色可視化的css3功能
cdn地址:
<script src="https://cdn.bootcss.com/css3pie/2.0beta1/PIE_IE9.js"></script>
Respond.js(www.github.com/scottjehl/respond)
// 讓舊版瀏覽器支持媒體查詢
cdn地址:
<script src="https://cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>
-prefix-free(lea.verou.me/projects)
// 為需要廠商前綴的css3聲明添加前綴
cdn地址:
<script src="https://cdn.bootcss.com/prefixfree/1.0.7/prefixfree.min.js"></script>
-borderBoxModel.js(www.github.com/albertogasparin/borderBoxModel
// 讓IE6和IE7支持CSS3的box-sizing屬性
基於CSS3 flexbox規范的網格樣式
<link href="https://cdn.bootcss.com/flexboxgrid/6.3.1/flexboxgrid.min.css" rel="stylesheet">
