css+div是**標準(或稱「web標準」)中常用的術語之一,通常為了說明與html網頁設計語言中的**(table)定位方式的區別,因為xhtml**設計標準中,不再使用**定位技術,而是採用css div的方式實現各種定位。應用應用div+css編碼時很輕易犯一些錯誤。本文列舉了一些常見的錯誤:
2. 檢查css是否正確
檢查一下有無拼寫錯誤、是否忘記結尾的 } 等。可以利用cleancss來檢查 css的拼寫錯誤。cleancss本是為css**的工具(css壓縮),但也能檢查出拼寫錯誤。
3. 確定錯誤發生的位置
假如錯誤影響了整體布局,則可以逐個刪除div塊,直到刪除某個div塊後顯示恢復正常,即可確定錯誤發生的位置。
4. 利用border屬性確定出錯元素的布局特性
使用float屬性布局一不小心就會出錯。這時為元素新增border屬性確定元素邊界,錯誤原因即水落石出(也叫浮動產生,了解如何清除css浮動)。
5. float元素的父元素不能指定clear屬性
macie下假如對float的元素的父元素使用clear屬性,四周的float元素布局就會混亂。這是macie的聞名的bug,倘若不知道就會走彎路。
6. float元素務必指定width屬性
很多瀏覽器在顯示未指定width的float元素時會有bug。所以不管float元素的內容如何,一定要為其指定width屬性。
另外指定元素時盡量使用em而不是px做單位。
7. float元素不能指定margin和padding等屬性
ie在顯示指定了margin和padding的float元素時有bug。因此不要對float元素指定margin和padding屬性(可以在float元素內部巢狀乙個div來設定margin和padding)。也可以使用hack方法為ie指定非凡的值。
8. float元素的寬度之和要小於100%
假如float元素的寬度之和正好是100%,某些古老的瀏覽器將不能正常顯示。因此請保證寬度之和小於99%。
9. 是否重設了預設的樣式?
某些屬性如margin、padding等,不同瀏覽器會有不同的解釋。因此最好在開發前首先將全體的margin、padding設定為0、css列表樣式設定為none等。
10. 是否忘記了寫dtd-doctype宣告?
假如無論怎樣調整不同瀏覽器顯示結果還是不一樣,那麼可以檢查一下頁面開頭是不是忘了寫下面這行dtd:
CSS常見問題
viewport fit,它有三個可選值 contain 可視視窗完全包含網頁內容 cover 網頁內容完全覆蓋可視視窗 auto 同contain的作用.box box after在flex多行布局中,justify content space between 這個屬性如果最後一行元素沒有填滿,會...
CSS常見問題
viewport fit,它有三個可選值 contain 可視視窗完全包含網頁內容 cover 網頁內容完全覆蓋可視視窗 auto 同contain的作用.box box after在flex多行布局中,justify content space between 這個屬性如果最後一行元素沒有填滿,會...
CSS常見問題
viewport fit,它有三個可選值 contain 可視視窗完全包含網頁內容 cover 網頁內容完全覆蓋可視視窗 auto 同contain的作用.box box after在flex多行布局中,justify content space between 這個屬性如果最後一行元素沒有填滿,會...