網頁中,所有的html標籤,都可以做為乙個盒子
a)border-width:寬度( border-top-width border-right-width
border-bottom-width border-left-width)
b)border-style:樣式( solid細邊框、dashed虛線邊框)
c)border-color:顏色
d)簡寫:border:1px solid red;
屬性說明(順時針:上右下左)
border-top-color
設定上邊框顏色
border-right-color
設定右邊框顏色
border-bottom-color
設定下邊框顏色
border-left-color
設定左邊框顏色
border-color
設定4個邊框為同一顏色
border-color:red;
上下邊框顏色為blue
左右邊框顏色為red
border-color:
blue red;
上邊框顏色為blue
左右邊框顏色為red
下邊框顏色為green
border-color:
blue red green;
上、下、左、右邊框顏色
分別為blue、red、green、black
border-color:
blue red green black;
e) 外邊距(盒子之間的距離)——margin
1、 居中——margin : 0px auto;
2、 margin-left\right\top\bottom:數字px;
f) 內邊距(文字或和盒子中間的間隙)——padding
padding-top\right\bottom\left (數字px)
說明:邊框、外邊距、內邊距,
簡寫方式方向(順時針),按上、右、下、左設定
一、 標準文件流
1、 塊級元素
a) 特徵:單獨佔據一塊區域,單獨佔一行,裡面包含內聯元素
b) 常用的塊級元素:
i. 標題標籤——
ii. 段落標籤——
iii. 層——
iv. **——
v. 表單——
vi. 列表:有序列表、無序列表、定義列表
2、 內聯元素
常用的內聯元素:、、、、、
表單元素
3、 標準文件流規則:塊級元素,包含內聯元素,反之則不行
三、 控制元素顯示和隱藏——display屬性
none——隱藏 block——顯示
html盒子模型 jquery盒子模型
最近學了jquery的盒子模型之後,感覺真的顛覆我之前對盒子模型的看法,我在最初以為盒子模型只存在於html,我們就來看看他們有何區別。1.html盒子模型 如果說js裡面萬物皆是物件,那麼html裡面的萬物皆是盒子。不是盒子的我們也可以用dispiay block 變成盒子。那他的盒子是怎麼計算的...
0416 盒子模型
css盒子模型樣式 定義 margin 外邊距,圍繞在元素邊框的空白區,在元素外建立額外的空白。border 邊框,圍繞元素內容和內邊距的一條或多條線。padding 內邊距,在邊框和內容區之間。屬性 margin 外邊距也叫作空白 接受任何長度單位,百分數值和負值,還可設定為auto。margin...
3 盒子模型
盒子模型是我學習css中使用頻率最高的模型,其中主要還是理解整個盒子的構成,以及其中各屬性的作用,最重要的問題就是合併巢狀問題。盒子模型 外邊距margin 邊框border 內邊距padding 內容 border color 邊框顏色 border width 邊框寬度 border style...