div css(Firefox hr 相容問題)

2021-05-22 13:33:53 字數 1269 閱讀 9180

firefox hr 相容問題,在ie中正常顯示的hr屬性設定,在firefox裡面不管怎麼弄都是不出來,最後看到一篇文章說ff中必須設定背景顏色才有效果的,這種問題自己閉門造車的話整上個三天三夜都找不到解決辦法啊!

把**貼出來分享下:

hr .imghrcontent

通常我們都會定義 hr 的顯示外觀, 例如顯示單行的細線, 像這裡顯示的這樣. 不過在 firefox 瀏覽器中, 這樣的定義會沒有任何效果甚至會看不到橫線:

hr 

但是只要加入背景色屬性, 就能顯示了:

hr 

-----------

因為ie和firefox對hr預設的各種屬性margin,padding等等都不一樣,所以定義為0也沒用。

我們可以通過下面的css hack來解決:

example source code [www.52css.com]

hr.ducky

不只是針對hr,這只是乙個例子。ie6和ie7對hr邊距margin的解釋是一樣的,所以都定為8px,firefox與ie有區別,下邊距只能為1px。

第一條ie6,ie7,firefox都讀懂,這時候都是1px;第二條ie6,ie7能讀懂,都用第二條的8px覆蓋了第一條的1px,firefox不懂,跳到分號以後的下一條,這時候ie6,ie7是8px,ff是1px;第三句ie6,ie7,ff都讀懂,因為ie6本身的bug,所以用第三條覆蓋了第二條,ie7因為第二條的!important所以忽視第三條,ff同理忽視第三條。 

這個時候,ie6看第三條,ie7看第二條,ff看第一條。雖然在這個例子裡,第三條沒有必要,因為ie6與ie7對hr的解釋是一樣的,但是這裡是可以對三種瀏覽器版本賦予不同的值。 

ducky認為最好的情況就是不用hack,只要寫的規範,一般問題不大,如果有一些差別的話,只要以ie作為第一瀏覽效果,ff稍微有點區別都沒關係,沒必要hack,不然維護起來很麻煩,當然只是我的想法。

後記:由於火狐和ie對高度的解釋不同,導致滾動的內容在ie裡面擷取的效果和火狐的不一樣,調整了半天就是無法

讓他們一樣完整擷取,後來受到上面的hack寫法的啟發,終於寫出第乙個時間的css hack來了,哈哈。

.imghrcontent 

.contendiv

.realcontent

signalR selfhost 版本相容問題

一 異常簡要說明最近在學習signalr,i按照 這個教程上安裝包時出現如下錯誤。二 分析原因在網上問了幾個人以後也沒解決,後來自己分析出原因,signalr.self.host和owin.cors都依賴於microsoft.owin這個包,而我們直接用命令安裝時會預設安裝最新版本,這樣乙個依賴的是...

sessionStorage 移動端相容問題

開發移動端專案,需要前端頁面儲存一些使用者資料是乙個常見的功能,sessionstorage和localstorage就是常用的選擇,最近移動端專案用到sessionstorage時遇到一些問題,如 vivo手機自帶瀏覽器 問題如下 a.html頁面記錄一條資料,sessionstorage.set...

Swift (與Objective C的相容問題)

雖然說 swift 語言的初衷是希望能擺脫 objective c 的沉重的歷史包袱和約束,但是不可否認的是經過了二十多年的洗禮,cocoa 框架早就烙上了不可磨滅的 objective c 的印記。無數的第三方庫是用 objective c 寫成的,這些積累無論是誰都不能小覷。因此,在最初的版本中...