div浮動(dòng)層與默認(rèn)的div層有什么關(guān)系
發(fā)表時(shí)間:2024-05-11 來(lái)源:明輝站整理相關(guān)軟件相關(guān)文章人氣:
[摘要]說(shuō)到浮動(dòng)首先我們要清楚一個(gè)概念,我們?yōu)槭裁丛O(shè)置浮動(dòng)樣式?因?yàn)橄胱孌IV對(duì)象盒子實(shí)現(xiàn)靠左或靠右布局。這樣我們的網(wǎng)頁(yè)就可以做的更美觀,交互性更強(qiáng),那么浮動(dòng)的DIV和默認(rèn)的DIV之間有什么不同呢?我們一起來(lái)看一下div浮動(dòng)層與div層有何不同css中有什么關(guān)系首先DIV浮動(dòng)層與DIV層都是指DIV布局,...
說(shuō)到
浮動(dòng)首先我們要清楚一個(gè)概念,我們?yōu)槭裁丛O(shè)置浮動(dòng)樣式?因?yàn)橄胱孌IV
對(duì)象盒子實(shí)現(xiàn)靠左或靠右布局。這樣我們的網(wǎng)頁(yè)就可以做的更美觀,交互性更強(qiáng),那么浮動(dòng)的DIV和默認(rèn)的DIV之間有什么不同呢?我們一起來(lái)看一下
div浮動(dòng)層與div層有何不同css中有什么關(guān)系
首先DIV浮動(dòng)層與DIV層都是指DIV布局,一般使用CSS樣式表加DIV標(biāo)簽組合進(jìn)行布局網(wǎng)頁(yè)。
div層一般包括div浮動(dòng)層,div浮動(dòng)層說(shuō)明div被加入css浮動(dòng)樣式所以被稱為div浮動(dòng)層,而沒(méi)有加入float浮動(dòng)樣式不具有浮動(dòng)效果,所以如果沒(méi)有被加浮動(dòng)樣式div不被稱為浮動(dòng)層。當(dāng)然span、h1、ul、li等標(biāo)簽也是層,只不過(guò)span、h1、ul、li等標(biāo)簽沒(méi)有div使用頻率高,所以一般就將div作為象征性稱呼。
接下來(lái)告訴大家什么是一般層,什么是浮動(dòng)層?為什么要使用div css浮動(dòng)層。
完整DIV+CSS實(shí)例HTML代碼如下
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>div層與浮動(dòng)層</title>
<style>
.div{ width:400px; height:100px}
.div-a{ float:left; border:1px solid #F00; width:100px; height:80px}
.div-b{ float:right; border:1px solid #00F; width:100px; height:80px}
</style>
</head>
<body>
<div class="div">
<div class="div-a"></div>
<div class="div-b"></div>
</div>
</body>
</html>
對(duì)象".div"沒(méi)有設(shè)置浮動(dòng),“.div-a”設(shè)置靠左浮動(dòng)(float:left),“.div-b”設(shè)置靠右浮動(dòng)(float:right)。
層與浮動(dòng)層總結(jié)
在以上實(shí)例中“.div”對(duì)象是普通層,而默認(rèn)是不具有浮動(dòng)效果的層,因?yàn)榫W(wǎng)頁(yè)內(nèi)容是居左的所以看到此層居左,實(shí)際是沒(méi)有浮動(dòng)樣式的一個(gè)DIV盒子層。而對(duì)象內(nèi)子級(jí)“.div-a”和“.div-b”是設(shè)置float浮動(dòng)所以變成了浮動(dòng)層,從上可以看出他倆在“.div”盒子內(nèi)一個(gè)靠左浮動(dòng)一個(gè)靠右浮動(dòng)。普通層與浮動(dòng)層區(qū)別就是在于是否被設(shè)置了css float浮動(dòng)樣式。
關(guān)于浮動(dòng)的不同已經(jīng)給大家介紹的很清楚了,更多精彩請(qǐng)關(guān)注php中文網(wǎng)其它相關(guān)文章!
相關(guān)閱讀:
html的span標(biāo)簽怎么使用
html的<textarea>怎么使用
html的滾動(dòng)條樣式設(shè)置
以上就是div浮動(dòng)層與默認(rèn)的div層有什么關(guān)系的詳細(xì)內(nèi)容,更多請(qǐng)關(guān)注php中文網(wǎng)其它相關(guān)文章!
網(wǎng)站建設(shè)是一個(gè)廣義的術(shù)語(yǔ),涵蓋了許多不同的技能和學(xué)科中所使用的生產(chǎn)和維護(hù)的網(wǎng)站。