1. 程式人生 > >(四十二)HTML標簽--3

(四十二)HTML標簽--3

spa 縮進 ffffff 就是 默認 otto 寬度 宋體 ott

一、標簽嵌套規則

塊級標簽能夠嵌套某些塊級標簽和內聯標簽(行內標簽)

內聯標簽不能塊級標簽,只能嵌套內聯標簽

塊級標簽能夠設置高度和寬度

內聯標簽不能設置,設置沒有效果

二、Css樣式

高度寬度:

Width:100px

Height:100px

字體:

Font-family:’宋體’

Font-size:10px; 默認大小是16px

Font-weight:bold; 自重 粗細 bold加粗

Color:red;rgb(255,255,255) rgba(255,255,255,0.3) 0.3是色彩透明度 兩位重重復的可簡寫#ffffff ==> #fff

文字對齊方式:

Text-align:center,right,left

文字裝飾,

Text-decoration:none;//underline,line-through去除橫線 多用於a標簽

首行縮進

Text-indent:32px;縮進兩個字符

背景屬性

背景顏色

Background:url(‘路徑’) no-repeat right top(200px,200px)

Display:

Display:none;隱藏標簽

Visibility:hidden;隱藏標簽,但是保留標簽所占位置

Display:block;將內聯標簽改為塊級標簽

Display:inline;將塊級標簽改為內聯標簽

Display:inline-block;將塊級標簽或者內聯標簽

,改成塊級標簽和內聯標簽的屬性,也就是不獨占一行,可以設置高度和寬度

Box-model:

Content: 裏面的內容 高度寬度就是我們設置widthheight

Padding:內邊距(內填充)

Padding-left

Padding-right

Padding-top

Padding-bottom

Border: 邊框

border-bottom:1px solid blue;
border-right:1px solid orange;
border-top: 2px solid red;
border-left: 3px dashed orange;
/*border: 3px orange;*/

Margin 外邊距,距離其他標簽的距離,兩個標簽如果都設置了margin,那麽兩個標簽之間的距離取最大的那個margin

Margin-left:距離左邊邊框
margin-top:距離上面邊框

Margin-right:距離右側邊框

Margin-bottom:距離底部邊框

標簽占的寬度:content寬度+左右padding + 左右邊框的距離

(四十二)HTML標簽--3