關(guān)于IE6/IE7/Firefox的CSS的兼容性

三種瀏覽器的識別問題:

1
2
3
#example { color: #333; } /* Moz */
* html #example { color: #666; } /* IE6 */
*+html #example { color: #999; } /* IE7 */

首先火狐不識別任何特殊符號,但是識別!important;而IE6識別*和_,而IE7則識別*也識別!important;但是不識別_

所以在出現(xiàn)IE7之前我們可以用!important;*來調(diào)整頁面,但是IE7的出現(xiàn)卻打亂了我們的方法!!

在大部分情況下,調(diào)整好火狐和IE7后,IE7不會出現(xiàn)太大的差距,一般情況下出現(xiàn)的問題就是

浮動ie產(chǎn)生的雙倍距離

舉一個網(wǎng)上大俠的例子:

1
2
#box{ float:left; width:100px; margin:0 0 0 100px; //這種情況之下IE會產(chǎn)生200px的距離
display:inline; //使浮動忽略}

這句display:inline很重要!!

這里牽扯到一個問題,因為IE存在CSS向后繼承,而Firefox不支持,因此如果我們不對每個標簽定義使用浮動float屬性的話,在Firefox中就會出現(xiàn)DIV溢出。使排版混亂.

另外的問題就是margin屬性的像素差問題.

舉個例子來解決:

margin-left:30px!important;margin-left:28px;

由于!important;只有IE7和Firefox識別,因此會默認執(zhí)行margin-left:30px,而IE6不識別!important;因此會執(zhí)行margin-left:28px;這樣,用相同的方法,我們就可以清除2px像素的差來達到無縫銜接.由于在使用margin 或padding 時,我們會發(fā)現(xiàn)padding所出現(xiàn)的差值問題要比margin少的多的多!因此我強烈建議大家能用padding的時候盡量不要使用margin,這樣會減少很多麻煩.

收藏自:http://blog.edotpower.com/article.asp?id=35

IE與Firefox的CSS兼容大全

CSS對瀏覽器器的兼容性具有很高的價值,通常情況下IE和Firefox存在很大的解析差異,這里介紹一下兼容要點。

常見兼容問題:

1、DOCTYPE 影響 CSS 處理

2、FF:div 設(shè)置 margin-left, margin-right 為 auto 時已經(jīng)居中,IE 不行

3、FF: body 設(shè)置 text-align 時, div 需要設(shè)置 margin: auto(主要是 margin-left,margin-right) 方可居中

4、FF: 設(shè)置 padding 后, div 會增加 height 和 width, 但 IE 不會, 故需要用 !important 多設(shè)一個 height 和 width

5、FF: 支持 !important, IE 則忽略, 可用 !important 為 FF 特別設(shè)置樣式

6、div 的垂直居中問題: vertical-align:middle; 將行距增加到和整個DIV一樣高 line-height:200px; 然后插入文字,就垂直居中了。缺點是要控制內(nèi)容不要換行

7、cursor: pointer 可以同時在 IE FF 中顯示游標手指狀, hand 僅 IE 可以

8、FF: 鏈接加邊框和背景色,需設(shè)置 display: block, 同時設(shè)置 float: left 保證不換行。參照 menubar, 給 a 和 menubar 設(shè)置高度是為了避免底邊顯示錯位, 若不設(shè) height, 可以在 menubar 中插入一個空格。
繼續(xù)閱讀

如何讓IE6-IE7-FF的CSS樣式一致

現(xiàn)在主流的瀏覽器分別是:Internet Explorer 6, Internet Explorer 7和Firefox 2。這讓我們在網(wǎng)站設(shè)計中不得不考慮如何使樣式“crossover”。這里介紹一個較為簡單的方法使樣式的顯示效果在上述三種瀏覽器中保持一致。

首先我們針對Firefox 2設(shè)計了如下的樣式代碼:

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; }

通過上面的方法,你應(yīng)該能夠讓你的設(shè)計樣式更具通用性了。

轉(zhuǎn)自Smartr.cn

最好的17個Firefox博客擴展

Firefox瀏覽器最大地一個好處就是當你有什么問題的時候,通常有一個擴展已經(jīng)為你準備好了.以下17個Firefox擴展能夠大大提高你寫博客地效率,一共包括3大內(nèi)容:信息搜集,文章撰寫和圖片處理.

一.信息搜集.
Google Notebook – 使用這個擴展簡隨時隨地收集網(wǎng)頁內(nèi)容以供后用,常駐在我的Firefox里面的擴展.目前的問題是響應(yīng)速度還是比較慢,不過編輯功能和筆記組織在上次升級之后就做得很不錯了.

– 使用這個擴展簡隨時隨地收集網(wǎng)頁內(nèi)容以供后用,常駐在我的Firefox里面的擴展.目前的問題是響應(yīng)速度還是比較慢,不過編輯功能和筆記組織在上次升級之后就做得很不錯了.

Session Manager – 可以保存當前打開的所有窗口和標簽,你可以手動保存,同時在瀏覽器崩潰時它還會自動保存.

coComment – 跟蹤你留在網(wǎng)上的評論.如果網(wǎng)友評論比主體文章提供更多信息資源,這個擴展就特別有用.比如Digg,評論里面通常會出現(xiàn)直接鏈接或者下載地址.

Speak It – 自動閱讀選定文章,可以讓你一邊瀏覽其他信息一邊聽取選定信息.這個擴展對中國用戶基本無用.

DocuFarm – 在瀏覽器里預(yù)覽Word,PDF文檔等,同時還提供一個PDF搜索引擎.

二.文章撰寫.
Scribefire – 最著名的離線博客編寫擴展,前身是Performancing.提供多個博客管理,分類管理,簡單的文字編輯工具.同時提供FTP上傳.但是可惜的是,對圖片的支持不太好.總的說來還是一款不錯的離線編輯器,特別是對于Linux用戶來說.

繼續(xù)閱讀

十個最好的Firefox擴展插件列表

Webware針對不同用戶的需求整理了不同的最佳Firefox擴展,相信總有一份列表你會滿意,從中發(fā)現(xiàn)有價值的內(nèi)容方便自己的使用。列表如下:

Download.com: Best extensions for Firefox 2
Webware.com’s brothers at Download.com have a good general list, as covered inthis post.

About.com: Top 10 Firefox extensions
A collection of some of the most popular and useful general Firefox extensions.

Irfan Habib: My top 10 Firefox extensions
A thoughtful list for serious Firefox users. See also the comments to this post, which point to other good extensions.

Read/Write Web: Top 10 Firefox Web 2.0 add-ons
The focus is on effective browsing, bookmarks, and RSS. A good lineup if you explore the Web a lot and want to keep track of things you find.

The Simple Dollar: 10 Firefox plugs that save you money
Love the premise, even if it’s stretched a bit thin in this list. This is an unconventional list of extensions that, one way or another, can impact your pocketbook.

繼續(xù)閱讀

提高瀏覽體驗的五十個最佳FireFox擴展插件

轉(zhuǎn)載自月光博客

FireFox的擴展插件有成百上千,你要用哪個呢?這里收集了50個流行的擴展插件,下載后安裝,會讓你的FireFox瀏覽更輕松。請注意,大多數(shù)擴展插件可以在FireFox2.0上使用,如果無法使用,那么使用Nightly Tester Tools擴展來讓他們工作。當一個新的FireFox版本發(fā)布后,這個擴展插件可以允許你輕松更新這些已經(jīng)存在的擴展。

標簽頁管理

All-in-One Gestures – 多合一鼠標手勢,集合了流行的滾動、導(dǎo)航等方位插件的鼠標手勢。

Tabbrowser Preferences – 增強式標簽頁瀏覽擴展,提供一個很全面的圖形界面,以便讓用戶能夠輕松更改Firefox中的隱藏設(shè)置,讓Firefox的標簽頁瀏覽功能更加強大和完善,并提供關(guān)于鏈接打開方式的詳細設(shè)置。

Tab Mix Plus – 在頁簽上增加了更多的功能,允許你在一個頁簽上打開多個鏈接,或者在多個頁簽打開同一個鏈接,合并或者關(guān)閉同一個域名的鏈接等。

Restart Firefox – 在文件菜單中加了一項“重啟firefox”,在安裝擴展或插件后,使用這個插件可以很方便,不用關(guān)閉FireFox。

Sessionsaver – 恢復(fù)上一次打開的頁面,如果你上次用過FireFox的話,這對于崩潰的FireFox同樣有效。

繼續(xù)閱讀