眾所周知IE6不支持position:fixed，這個bug與IE6的雙倍margin和不支持PNG透明等bug一樣臭名昭著。前些天我做自己的博客模板的時候，遇到了這個問題。當時就簡單的無視了IE6——盡管有幾個使用IE6的朋友，一起BS我……但是對于大項目或商業網站，如果有用到這個屬性的時候，是不可能直接無視的。
你是如何讓position:fixed在IE6中工作的？
本文所使用的技巧是用了一條Internet Explorer的CSS表達式(expression)。你不可以直接使用該表達式，因為它可能會因為緩存而不更新。解決這一點的最簡單的方式是使用eval包裹你的語句。
如何解決“振動”的問題？
顯然IE有一個多步的渲染進程。當你滾動或調整你的瀏覽器大小的時候，它將重置所有內容并重畫頁面，這個時候它就會重新處理css表達式。這會引起一個丑陋的“振動”bug，在此處固定位置的元素需要調整以跟上你的(頁面的)滾動，于是就會“跳動”。
繼續閱讀
IE的IMG標簽一直顯示不了PNG圖像的透明背景，前幾天在藍色理想看到一個解決的方法：使用AlphaImageLoader和Alpha濾鏡通過CSS的方法顯示透明的PNG圖片
繼續閱讀
CSS對瀏覽器器的兼容性具有很高的價值，通常情況下IE和Firefox存在很大的解析差異，這里介紹一下兼容要點。
常見兼容問題：
1、DOCTYPE 影響 CSS 處理
2、FF：div 設置 margin-left， margin-right 為 auto 時已經居中，IE 不行
3、FF: body 設置 text-align 時， div 需要設置 margin: auto(主要是 margin-left，margin-right) 方可居中
4、FF: 設置 padding 后， div 會增加 height 和 width， 但 IE 不會， 故需要用 !important 多設一個 height 和 width
5、FF: 支持 !important， IE 則忽略， 可用 !important 為 FF 特別設置樣式
6、div 的垂直居中問題: vertical-align:middle; 將行距增加到和整個DIV一樣高 line-height:200px; 然后插入文字，就垂直居中了。缺點是要控制內容不要換行
7、cursor: pointer 可以同時在 IE FF 中顯示游標手指狀， hand 僅 IE 可以
8、FF: 鏈接加邊框和背景色，需設置 display: block， 同時設置 float: left 保證不換行。參照 menubar， 給 a 和 menubar 設置高度是為了避免底邊顯示錯位， 若不設 height， 可以在 menubar 中插入一個空格。
繼續閱讀
現在主流的瀏覽器分別是：Internet Explorer 6， Internet Explorer 7和Firefox 2。這讓我們在網站設計中不得不考慮如何使樣式“crossover”。這里介紹一個較為簡單的方法使樣式的顯示效果在上述三種瀏覽器中保持一致。
首先我們針對Firefox 2設計了如下的樣式代碼：
1 | #MyDiv { margin : 10px 10px 10px 10px; } |
然后針對Internet Explorer 6進行樣式修改，使用如下的代碼語句，該代碼只能被 IE 6 識別：
1 2 | /* IE6 Only */ * html #MyDiv { margin : 5px 5px 5px 5px; } |
最后針對Internet Explorer 7進行如下樣式修改，該代碼也只能被 IE 7 識別：
1 2 | /* IE7 Only */ *:first-child+html #MyDiv { margin : 2px 2px 2px 2px; } |
通過上面的方法，你應該能夠讓你的設計樣式更具通用性了。