教育行業(yè)A股IPO第一股(股票代碼 003032)

全國咨詢/投訴熱線:400-618-4000

float和position屬性實(shí)現(xiàn)CSS的浮動(dòng)和相對(duì)定位

更新時(shí)間:2022年06月10日18時(shí)51分 來源:傳智教育 瀏覽次數(shù):

CSS的浮動(dòng)和定位可以改變?cè)氐呐帕蟹绞剑咕W(wǎng)頁內(nèi)容變得豐富多彩。CSS的浮動(dòng)可以通過float屬性進(jìn)行設(shè)置。首先我們來介紹float的常用屬性值,屬性值和屬性描述如下表:

屬性值和屬性描述

1.CSS允許任何元素浮動(dòng),不論是列表、段落還是圖像。無論元素先前是什么狀態(tài),浮動(dòng)后都成為塊級(jí)元素,浮動(dòng)元素的寬度缺省為auto。

2.浮動(dòng)元素的外邊緣不會(huì)超過其父元素的內(nèi)邊緣。

3.如果一個(gè)浮動(dòng)元素在另一個(gè)浮動(dòng)元素之后顯示,而且會(huì)超出容納塊(沒有足夠的空間),則它下降到低于先前任何浮動(dòng)元素的位置,即換行顯示。

position屬性可以讓網(wǎng)頁中的某個(gè)元素在網(wǎng)頁的特定位置出現(xiàn),如彈出菜單。

設(shè)置定位方式的常用屬性值

浮動(dòng)元素
設(shè)置元素具體位置的常用屬性值
重疊是當(dāng)一個(gè)父元素中的多個(gè)子元素同時(shí)被定位時(shí),定位元素之間有可能會(huì)發(fā)生:
重疊元素
顯示器顯示的圖案是一個(gè)二維平面,使用×軸和y軸來表示位置屬性。
位置屬性
z-index屬性表示Z軸的深度,它表示三維立體的概念,多個(gè)定位子元素的上下層的立體關(guān)系。
·可以控制定位元素在垂直于顯示屏方向(z軸)上的堆疊順序
·值大的元素發(fā)生重疊時(shí)會(huì)在值小的元素上面,其取值可為正整數(shù)、負(fù)整數(shù)和0,默認(rèn)值為0。
·只能在position屬性值為relative、absolute或fixed的元素上有效。z-index值越大的元素越靠近用戶。
三維空間
三維空間
0 分享到:
和我們?cè)诰€交談!