您好,登錄后才能下訂單哦!
小編給大家分享一下CSS中hack有什么用,相信大部分人都還不怎么了解,因此分享這篇文章給大家參考一下,希望大家閱讀完這篇文章后大有收獲,下面讓我們一起去了解一下吧!
SS中的hack就是針對不同的瀏覽器和版本來寫不同的CSS樣式,使其能呈現出我們想要的頁面效果
CSS hack主要是用來解決瀏覽器的兼容問題,能夠針對不同的瀏覽器去寫不同的CSS,而且還能在不同的瀏覽器中得到想要的頁面效果。
hack的定義:
hack就是由于不同廠商的瀏覽器,如Internet Explorer,Firefox,Chrome等,或者是同一廠商的瀏覽器的不同版本,對CSS的支持不同,所以生成的頁面效果也不一樣,在這個時候就需要我們針對不同的瀏覽器去寫不同的CSS,讓它能夠同時兼容不同的瀏覽器,能在不同的瀏覽器中得到我們想要的頁面效果。換句話說, hack的目的就是使你的CSS代碼兼容不同的瀏覽器
例如:我們在寫CSS3屬性時經常會碰到針對不同的瀏覽器需要寫不同的代碼,如下所示
animation:5s;/*標準版*/ -moz-animation: 5s;/* Firefox */ -webkit-animation:5s;/* Safari 和 Chrome */ -o-animation:5s;/* Opera */
!important問題:
Internet Explorer 6及以下的版本中的!important標識符存在問題,如果同一屬性的另一個樣式出現在同一樣式聲明塊中,就會導致該標識符被忽略。這可用于提供Internet Explorer 6及其他瀏覽器忽略的特殊屬性值。但在Internet Explorer 7及以上這個問題就不存在了
p { background: green !important; background: red; } </style> </head> <body class="page-body"> <p>Test</p>
我們可以通過IE瀏覽器上的F12調試工具切換IE的版本來看運行的效果
在IE5上:
在IE8上:
*html的問題
hack部分的代碼用星號“*”表示后面跟“html”。這是通用選擇器和元素類型選擇器的組合。在某些時候,這兩個選擇器一起在另一個選擇器之前,只在在某些低版本的的中才有效果,而在其他瀏覽器中沒有效果。雖然沒有效果它依然不會報錯,因為實際上個它是有效的
*html p { background: green; background: red; } </style> </head> <body class="page-body"> <p>Test</p>
在IE5上:
在IE8上:
以上是“CSS中hack有什么用”這篇文章的所有內容,感謝各位的閱讀!相信大家都有了一定的了解,希望分享的內容對大家有所幫助,如果還想學習更多知識,歡迎關注億速云行業資訊頻道!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。