border:邊框
padding:內邊距
margin:外邊距
content:內容
盒子的長寬實際與內容的長寬相同。
三大屬性:邊框顏色,邊框線型,邊框粗細
四個邊可分開設定。
邊框定義可以簡寫,且三大屬性無順序要求。
四個邊可分開設定。
可共同設定意義如下
padding: 10px;
四個內邊距都是10px
padding: 10px 15px;
四個內邊距 代表上下,左右
padding: 10px 15px 20px ;
四個內邊距 代表上,左右,下
padding: 10px 15px 20px 25px;
四個內邊距 代表上,右,下,左
3.應用: 可設定導航欄均勻
padding: 0px 20px;
內邊距為20,可以使格仔均勻
四個邊可分開設定。
可共同設定意義如下
padding: 10px;
四個外邊距都是10px
padding: 10px 15px;
四個外邊距 代表上下,左右
padding: 10px 15px 20px ;
四個外邊距 代表上,左右,下
padding: 10px 15px 20px 25px;
四個外邊距 代表上,右,下,左
3.應用: 可設定元素居中
margin: auto;或
margin: 0 auto;
只要左右外邊框為自動,塊級元素便可以居中
text-align: center;
另沒有寬度的行內元素,可以居中
**例項:
lang
="en"
>
>
charset
="utf-8"
>
name
="viewport"
content
="width=device-width, initial-scale=1.0"
>
>
盒子屬性title
>
>
.div0
.div1
.div2
.div3
.span1
.span2
*style
>
head
>
>
class
="div0"
>
div>
class
="div1"
>
四大屬性div
>
class
="div0"
>
div>
class
="div2"
>
居中div
>
class
="div0"
>
div>
class
="div3"
>
class
="span1"
>
長的內容----span
>
class
="span2"
>
短的span
>
class
="span1"
>
較長的span
>
div>
body
>
html
>
網頁樣式: (9)CSS背景控制
前面已經提到,css將每個元素視為在單獨的框中進行處理,那麼我們可以通過一些屬性改變元素對應的框的背景,以改善網頁樣式。1 background color 為任何元素指定單一背景顏色 該屬性的值可以為顏色名 16進製制編碼或者rgb值。2 background image 將任一元素的背景設定為一...
9 CSS樣式引入
標籤上使用style屬性直接引入css樣式,即內聯樣式。style color red font size 24px 這是乙個段落p body 在頭部標籤內通過設定css樣式,即內部樣式。charset utf 8 網頁標題title pstyle head 這是一段文字p body html 新建...
html css js入門 9 CSS樣式
css 樣式 css 單位 尺寸 百分比 in 英吋 cm 厘公尺 mm 公釐 pt 磅 1pt等於1 72英吋 px 畫素 計算機螢幕上的乙個點 em 1em等於當前的字型尺寸,2em等於當前字型尺寸的兩倍 css 單位 顏色 rgb x,x,x rgb值,如 rgb 255,0,0 rgb x ...