CSS屬性
段落屬性
letter-spacing:10px; 字與字之間的距離
word-spacing:1px; 單字與單字間的距離(多用於英文網站)
text-transform:每個單字首字母大寫)uppercase(全部大寫)lowercase(全部小寫)(多用於英文網站)
white-space:normal/nowrap(不換行)
盒模型
所有的標籤都看作是一個盒子;
把塊級元素看作一個大盒子,把行內元素看作一個小盒子
一個盒模型的體現由哪些部分組成?
width+height(內容的寬和高)+padding(內邊距/內填充)+border(邊框)+margin(外邊距)
border:(邊框)
border-top:
border- bottom:
border-left:
border-right:
border-bottom:(下邊框)
border-bottom-style:solid(實線)dashed(虛線)dotted(點雙線)dole(實線) 邊框的線型
border-bottom-width:3px;邊框的粗細
border:3porder solid red;邊框的粗細
border:3porderx solid red; 0;
border-top:none/0;
border-collapse:collapse(去掉重邊)
padding:(內邊距、內填充、內補白) 內容到邊框的距離相對
padding-top :
padding-left:
padding-right:
padding-bottom:
(padding會影響盒子的寬度和高度)
padding:10px(padding)
)
padding:10px(pad面左右
; )
padding:10px 20px 30px;(上右下)左=右《遵循順時針的原則》
padding:10px 20px 30px 40px;(上右下左)
只(padp)
;能這樣寫)
margin:(外邊距、外填充) 標籤與標籤之間的距離
相對
行內元素上下外邊距無法實現
塊級元素上下外邊距無法累加,只能取最大值
塊級元素上下外邊距無法累加,只能取最大值
塊級元素上下外邊距無法累加,只能取最大值
無論行內或區塊級元素左右的外邊距都是累加值
外邊距不會影響盒子的寬度和高度
margin:10px(上下左右)
margin:10px 20px;(上下左右)
margin:10px 20px;(上下左右)
mar:10px 10px 20px 30px;(上右下)左=右《遵循順時針的原則》
margin:10px 20px 30px 40px;(上右下左)
margin:0 0 5px;(上右下左)
margin:0 0 5px 0(M
一個盒子的實際大小:
寬度:內容的寬(width)+border(左右)+padding((左右)+margin(左右)
高度:內容的高(height)+border(上下)+padding (上下)+margin(上下)
外邊距的應用:使盒子在瀏覽器中居中,在父元素的居中方式
margin:0 auto;