注:其中的內容只是自己學習時的一些筆記,好記性不如爛筆頭,在此記錄方便以後鞏固!
1、邊距
(1)內邊距
padding-top
padding-left
padding-right
padding-bottom
值為畫素值
(2)外邊距
margin-top
margin-left
margin-right
margin-bottom
值為畫素值
內外邊距都可以使用復合屬性 但是使用的時候得有個順序了
四個值的時候分別表示 上 右 下 左 (順時針的方向)
兩個值的時候 第乙個表示上下 第二個表示左右
三個值的時候 第乙個表示上 第二個表示左右 第三個表示下
2、**設定
首先設定**的border,這個時候設定的是整個**的外圍邊框,裡面的td什麼的還是沒變化
設定table的屬性:cellspacing=0 cellpadding=0(去除各單元格之間的間距)
為**設定合併邊框模型
border-collapse:collapse
除去**之間層疊的部分
3、盒子模型
(1)盒子模型的組成
內容+內邊距+邊框+外邊距
(2)尺寸的計算
尺寸為元素實際所佔的網頁空間
寬度:非ie6瀏覽器width:
margin-left + border-left + width + border-right + margin-rigth
ie6 width:
margin-left + border-left + width +(左右內邊距) + border-right + margin-rigth
ie6的width這個時候的width就與我們定義的不一致了,寬度會變寬,撐大了
高度:非ie6瀏覽器高度計算方法同寬度計算方法
高度=margin-top + border-top + height + border-bottom + margin-bottom
如果出現內容超出高度,則內容溢位,要想實現自動撐開,這需要設定最小高度min-height
ie6瀏覽器:
高度沒有準確的計算方法
內容超出高度 自動撐開
解決ie6瀏覽器與非ie6瀏覽器盒子模型相容性問題
*******************很重要***********************
有寬度的元素盡量避免使用padding-left、padding-right
使用了padding-left、padding-right的元素盡量不設定寬度width
在製作網頁時,先將標籤內的內外邊距去除,設定為0
CSS樣式學習筆記?
如何利用css做到 混排?把文字當作處理,當作文書處理 為了保證不佔一行 或乙個div 需要用float left這個樣式,寫海報 首字母下沉 效果需要用到這個樣式 利用標籤做導航標籤?設定list style type none float left 可以不需要標籤,如果有則也需要將list st...
css樣式學習筆記一
注 其中的內容只是自己學習時的一些筆記,好記性不如爛筆頭,在此記錄方便以後鞏固!1 web標準 結構 html 表現 樣式 行為 js 2 樣式的選擇器 1 標籤 元素選擇器 p 2 類選擇器 time1 3 id選擇器 time2 4 萬用字元選擇器 3 樣式分類 1 內嵌樣式表 在內聯樣式表中新...
css樣式學習筆記七
注 其中的內容只是自己學習時的一些筆記,好記性不如爛筆頭,在此記錄方便以後鞏固!一 屬性選擇器 css3.0以後的版本會支援的 1 選擇器 屬性 值 比如 p align right input type button 2 選擇器 屬性 input value 二 邊距 外邊距 1 ie6容易出現雙...