做web開發最痛苦的事情莫過於讓我們的css和js相容各個瀏覽器了。主流的瀏覽器採用不同的核心(rendering engine 或 layout engine)把我們推向痛苦的深淵。
如使用gecko的firefox,使用trident的ie,使用webkit的safari和google chrome等。
今天和大家分享乙個chrome和ff,ie之間css相容的小技巧:
1.在ie和ff中,使用如下**做reset清除padding和margin,在chrome下不起作用:
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td
需要這樣寫:
*
2:半透明問題:
ie:filter:alpha(opacity=sqln)
其中 sqln的值域為[0, 100]
firefox:
-moz-opacity:sqln
其中sqln的值域為[0, 1]
chrome和safari:
opacity:sqln
其中sqln的值域為[0, 1]
3。不同的瀏覽器對css的解釋都有一點出入,特別是padding, line-height這些要細微控制的地方,下面的hack基本可以解決這個問題:
• 在屬性前加下劃線(_),那麼此屬性只會被ie6解釋
• 在屬性前加星號(*),此屬性只會被ie7解釋
• 在屬性值後面加"\9",表示此屬性只會被ie8解釋
各瀏覽器css hack相容表:
ie6ie7ie8firefoxchromesafari
!importantyy
_y
*y
y*+
y\9yyy
\0
ynth-of-type(1)yy
#test
body:nth-of-type(1) p /* chrome、safari支援 */
4. iframe問題
iframe框架內頁:
父視窗:
iframe1中文字框的值:
container of 的的的原理
另外一篇,同樣精彩,揭開linux核心中container of的神秘面紗 華清遠見嵌入式學院講師。在linux 核心中有乙個大名鼎鼎的巨集container of 這個巨集是用來幹嘛的呢?我們先來看看它在核心中是怎樣定義的。呵呵,乍一看不知道是什麼東東。我們先來分析一下container of p...
存在的就是合理的,發生的即是必然的。
筆者有時候會想,什麼是對,什麼是錯?對於追求某一件事情之前首先會考慮,為什麼我要做這件事情。所以經過自我分析和生活周邊環境的總結。我認為,對於乙個人來,這是在站在個體的角度上說。什麼是對的?就是你自己覺得是對的,它就是對的。不過這個只是你自己的想法。主觀上的正確,不代表客觀上也受到了別人的認可。就拿...
Apache的rewrite的重寫相關的引數
apache mod rewrite規則重寫的標誌一覽 使用mod rewrite時常用的伺服器變數 rewriterule規則表示式的說明 匹配任何單字元 chars 匹配字串 chars chars 不匹配字串 chars text1 text2 可選擇的字串 text1或text2 匹配0到1...