已解決430363個問題，去搜搜看，總會有你想問的

css float屬性

首頁猿問 css float屬性

css float屬性

CSS3 Html/CSS

慕先生4543078 2017-06-19 11:11:05

<div></div> <div></div> <div></div> <div></div>div{ ????width:?100px; ????height:?100px; ????background:?red; ????margin:?5px; } div:nth-of-type(2){ ????float:?left; }結果我本來是想讓第二個、第三個<div>并列，水平拉開5px對齊。我有幾個問題：1、為什么第二個<div>加了float:left后margin都沒了？2、按理說第三個<div>應該是排在第二個<div>后面的，并且拉開5px的margin的，這個和第二個<div>的外邊距沒什么關系，為什么會和第二個重疊了？而且加了float屬性后似乎上邊距消失了，這是為什么？3、我想讓第一個占一行，第四個占一行，第二、第三占一行，第二個和第三個并列應該怎么寫css？

查看完整描述

1 回答

已采納

李曉健

TA貢獻1036條經驗獲得超461個贊

1:?第二個<div>加了float:left后margin是有的。

2：因為第二個設置了浮動，所以他會脫離文檔流，就會蓋在第三個的上面

<!DOCTYPE?html>
<html?lang="en">
<head>
????<meta?charset="UTF-8">
????<title>Title</title>
????<style>
?div{
?width:?100px;
?height:?100px;
?margin:?5px;
?}
?div:nth-of-type(2),div:nth-of-type(3){
?display:?inline-block;
?}

?</style>
</head>
<body>
<div?style="background-color:?#00a854"></div>
<div?style="background-color:?red"></div>
<div?style="background-color:?blue"></div>
<div?style="background-color:?yellow"></div>
</body>
</html>

反對回復 2017-06-19

慕先生4543078
感謝你的回答，關于第二點我還有個不明白的地方：第二個<div>設置了float屬性后，脫離文檔流，那不應該是從頭排起嗎（即覆蓋到第一個<div>，從文檔的初始位置開始）。這個“脫離文檔流”是以什么為標準來定位的？

回復 2017-06-20
李曉健
浮動層：給元素的float屬性賦值后，就是脫離文檔流，進行左右浮動，緊貼著父元素(默認為body文本區域)的左右邊框。而此浮動元素在文檔流空出的位置，由后續的(非浮動)元素填充上去：塊級元素直接填充上去，若跟浮動元素的范圍發生重疊，浮動元素覆蓋塊級元素。內聯元素：有空隙就插入。

回復 2017-06-20
qq_刮開有獎_0
float只對后邊元素有影響，是不會蓋到前邊元素上的

回復 2017-08-23

1 回答
1 關注
2825 瀏覽

關注

亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

css float屬性

css float屬性

1 回答

相關問題推薦

添加回答

亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

熱搜

最近搜索清空

css float屬性

css float屬性

1 回答

相關問題推薦

添加回答