網(wǎng)站重構(gòu)和css編程進階-在線瀏覽
2024-09-11 13:43本頁面
【正文】 不是內(nèi)容的定義寬度(width)，而是內(nèi)容，填充和邊框的寬度總和； 定義的寬度。 IE和 FF的盒模型解析差異 * b. FF標準模式解析差異 myBox { width:300px。 padding:10px。 backgroundcolor: red。 height:50px。 } IE和 FF的盒模型解析差異 * b. FF標準模式解析差異 IE和 FF的盒模型解析差異 FF標準模式解析差異 結(jié)論： 當(dāng)父和子標簽垂直疊加時， IE在垂直方向上不會做 padding和 margin疊加，而 FF會；而當(dāng)父標簽 padding為 0時， FF會把子標簽的 margin疊加到父標簽上面，子標簽和父標簽之間不在有間距。 普通流、絕對定位、和浮動 默認的定位。 普通流、絕對定位、和浮動 普通流、絕對定位、和浮動 普通流、絕對定位、和浮動 特點： ① 相對定位無論是否移動，元素仍然占據(jù)原來的空間； ② 絕對定位不占據(jù)空間，絕對定位的標簽位置相對于最近已定位的父標簽，如果不存在，則相對于 body； ③ IE中如果相對于右 (right)和底部 (bottom)設(shè)置絕對定位，需要確定相對定位的框設(shè)置了尺寸 。 》 正文的圖文混排 ② 塊級元素 float以后就沒有默認的 100%寬度。 四、實踐 1. 超鏈接樣式 2. 分頁 3. 圓角框 4. 導(dǎo)航條 5. 滑動門技術(shù) 6. 圖像陰影和圖像映射 7. 表格和表單 8. 圖文混排 超鏈接樣式 * a. 背景圖結(jié)合填充 b. 設(shè)置為塊級標簽獲得寬高屬性 c. 用文本縮進隱藏文字鏈接 d. 鏈接偽類實現(xiàn)背景替換 分頁樣式 * a. 圓角框 a. 簡單的圓角框 圓角框 * b. 高度自適應(yīng)的圓角框 圓角框 c. 高度和寬度都自適應(yīng)的圓角框 導(dǎo)航條 a. 垂直導(dǎo)航條 ul liAutos/li
教學(xué)課件相關(guān)推薦
鄂ICP備17016276號-1