自我總結CSS中的陷阱(長期更新)

2021-09-20 06:43:35 字數 1929 閱讀 9483

ie6 position:fixed不支援:通過css expression解決,或者是_position:absolute。

* html, 

* html body

* html #menu

ie6 png24: 通過dd_belatedpng.js解決。

ie678不支援css3動畫屬性: 通過解決;

ie6下雙倍邊距問題: 通過*display:inline解決。

ie6下非a標籤的:hover偽類無效:通過js操作解決

ie6下用border屬性寫三角形

如果用

border-width:10px;

border-color: transparent transparent transparent transparent;

border-style:solid;

這樣寫的話會出現黑邊,

解決方案是使用

doshed:border-style:dashed dashed solid dashed ;
ie6下絕對定位的bug

相對於相對定位的祖先元素對框進行絕對定位,這在大多數現代瀏覽器中實現得很好。但是,在windows上的ie5.5和ie6中有乙個bug,如果試圖相對於相對定位的框的右邊或底部設定絕對定位的框的位置,那麼需要確保相對定位的框已經設定了尺寸。如果沒有,那麼ie會相對於畫布定位這個框。簡單的解決方案時為相對定位的框設定寬度和高度。

怎樣讓ie瀏覽器支援最小高度

ie不識別min-這個定義,實際上它把正常的width和height當作有min的情況來使用的。

min-height:200px;

height:auto;

_height:200px;

注意 height一定要在_height之前。

無法定義1px左右高度的容器

ie6下這個問題是因為預設的行高造成的,解決的方法也有很多,

例如:overflow:hidden | zoom:1 | line-height:1px

ie6下為什麼下有空隙產生?

解決方法是可以改變html的排版,或者設定img為display:block

或者設定vertical-align屬性為vertical-align:top|bottom|middle|text-bottom;

ie7以下不支援display:inline-block

解決方案:

第一種:專門為ie7寫hack

display:inline-block;

*display:inline;

*zoom:1;

特別是 zoom:1 這個必須的(觸發haslayout)

第二種:

.selector 

.selector

注意這兩個 display要先後放在兩個css宣告中才有效果,這是ie的乙個經典bug,如果先定義了display:inline-block,然後再將 display設回inline或block,layout不會消失。不能寫進乙個宣告中。

另外:input、select、button、textarea的預設display皆為inline-block,所以    在布局時應加以注意...

原因:z-index導致,使用如下嵌入方式。並用wmode="transparent"

Django中遇到的問題 長期更新

本帖用於記錄在學習django的時候遇到的問題以及解決方式 報錯資訊 server returns invalid timezone.go to advanced tab and set servertimezone prope 報錯原因 沒有設定時區 解決辦法 cmd 進入資料庫mysql hlo...

python中的進製轉換(長期更新)

python中存在內建函式 bin oct int hex 可實現進製轉換。對於最常見到的十進位制數,可以利用內建函式快速轉換到對應的二進位制 八進位制 十六進製制字串。基本操作如下 呼叫返回 說明bin 8 0b1000 十進位制8轉換為二進位制 0b 是二進位制字首 oct 15 0o17 十進...

Javascript中css選擇器的陷阱

之前寫了一大段都刪了,想了想沒必要介紹api的使用。queryselector queryselectorall這兩個api現在應該沒人不知道 這裡只簡單說下使用時容易遇到的兩個坑 document.queryselectorall返回的是靜態的nodelist,可以理解為某一時間的快照 舉個例子說...