hack技術

什麼是hack 技術：
行業中存在各種瀏覽器，典型的瀏覽器包括 IE 、火狐、谷歌等等；同樣種類的瀏覽器，也存在着不同的版本，如 IE6、IE7…等。
不同瀏覽器對 CSS 解析機制並不是完全相同，因此會導致不同瀏覽器中，頁面的效果各不相同。
此時可以針對某種瀏覽器進行樣式設置，從而達到所有瀏覽器顯示的效果一致，這種標識不同瀏覽器的方法就是 hack
簡單地說就是可以通過 hack 技術，只針對某一種或幾種瀏覽器進行樣式設置.
常用的 IE hack：

屬性前綴法(即類內部Hack)

代碼示例

針對的瀏覽器

_width:400px; IE6

+width400px; IE6 IE7

width:400px; IE6 IE7

Width:200px\9; IE6~IE10

Width:100px\0; IE8~IE11

不同瀏覽器兼容的代碼:

/Mozilla內核瀏覽器：firefox3.5+/
-moz-transform: rotate | scale | skew | translate ;
/Webkit內核瀏覽器：Safari and Chrome/
-webkit-transform: rotate | scale | skew | translate ;
/Opera/
-o-transform: rotate | scale | skew | translate ;
/IE9/
-ms-transform: rotate | scale | skew | translate ;
/W3C標準/
transform: rotate | scale | skew | translate ;

選擇器前綴法(即選擇器Hack)

*html *前綴只對IE6生效
*+html *+前綴只對IE7生效
@media screen\9{…}只對IE6/7生效
@media \0screen {body { background: red; }}只對IE8有效
@media \0screen,screen\9{body { background: blue; }}只對IE6/7/8有效
@media screen\0 {body { background: green; }} 只對IE8/9/10有效
@media screen and (min-width:0\0) {body { background: gray; }} 只對IE9/10有效
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {body { background: orange; }} 只對IE10有效

IE 條件註釋： IE 中的條件註釋對 IE 的版本和 IE 非 IE 有優秀的區分能力，是 Web 開發中常用的hack方法，能對 IE 系列產品進行單獨的 HTML 代碼處理