網站重構和css編程進階(編輯修改稿)
2024-08-28 13:43 本頁面
【文章內容簡介】 異 * b. FF標準模式解析差異 IE和 FF的盒模型解析差異 FF標準模式解析差異 結論： 當父和子標簽垂直疊加時， IE在垂直方向上不會做 padding和 margin疊加，而 FF會；而當父標簽 padding為 0時， FF會把子標簽的 margin疊加到父標簽上面，子標簽和父標簽之間不在有間距。 解決方案 ： 使用統(tǒng)一的標準文檔聲明，不要在父、子標簽重復定義 padding和 margin屬性。 普通流、絕對定位、和浮動 默認的定位。各標簽在頁面上的位置是由標簽在html代碼中的位置和自身的屬性（塊級標簽或者內聯(lián)標簽）決定的。 普通流、絕對定位、和浮動 普通流、絕對定位、和浮動 普通流、絕對定位、和浮動 特點： ① 相對定位無論是否移動，元素仍然占據原來的空間； ② 絕對定位不占據空間，絕對定位的標簽位置相對于最近已定位的父標簽，如果不存在，則相對于 body； ③ IE中如果相對于右 (right)和底部 (bottom)設置絕對定位，需要確定相對定位的框設置了尺寸 。 普通流、絕對定位、和浮動 * c. 浮動 普通流、絕對定位、和浮動 * c. 浮動 普通流、絕對定位、和浮動 * c. 浮動 普通流、絕對定位、和浮動 c. 浮動 特點： ① 當元素浮動時，它將不再處于文檔流中，相當于浮在文檔之上，不占據空間，但是會縮短行框。 》 正文的圖文混排 ② 塊級元素 float以后就沒有默認的 100%寬度。 》非常漂亮的純 CSS陰影效果 ③ 因為浮動元素脫離了文檔流，所以包含圖片和文本的 div不占據空間，所以要在這個 div的某個地方清除浮動 *。 四、實踐 1. 超鏈接樣式 2. 分頁 3. 圓角框 4. 導航條 5. 滑動門技術 6. 圖像陰影和圖像映射 7. 表格和表單 8. 圖文混排 超鏈接樣式 * a. 背景圖結合填充 b. 設置為塊
教學課件相關推薦
鄂ICP備17016276號-1