HTML搭六个盒子怎么弄成两行并排

用大div加ul确实方便控制。
不过你的方式也能实现效果。

关键是浮动布局。
大div宽度设为3 到4 个单位,比如3 rem或1 2 0px。
内部内容用float: left;。

上周刚处理一个类似需求。
直接套div也能排整齐。

ul li方式兼容性好些。
但div+float更灵活。

你自己看哪种更适合你。

html布局,下面怎么使两个div在同一行显示?

嗯... 左左左左... 对啊... 左右左右...
2 02 2 年... 某个城市... 我当时也懵... 看到这种代码...
浮动... 左浮动... .p_left{float:left;}... .p_right{float:left;}... 这样就行...
然后那个... display:inline-block;... 嗯... 那个... 代替了浮动... 也可以...
中间有空格... 他会留空格... 上面的就不会... 块状换成行内块...
.p_left{display:inline;}... .p_right{display:inline;}... 这样也行...
界面设计... 常常需要... 两个div同一行...
比如... “第一个div”和“第二个div”...
<divid="id1 ">  /外层div/ <divid="id2 "style="width:1 00px;height:2 0px;">第一个div</div> <divid="id3 "style="width:1 00px;height:2 0px;">第二个div</div> </div> ...
只需要... 对id2 和id3 增加css样式...
<divid="id1 ">  /外层div/ <divid="id2 "style="width:1 00px;height:2 0px;float:left;">第一个div</div> <divid="id3 "style="width:1 00px;height:2 0px;float:left;">第二个div</div> </div> ...
然后... 就好了...
可能我偏激... 嗯...

使用层进行网页布局时,如何实现层的精确定位?

这个你用float确实能搞定,不过现在CSS新方法多啦,flexbox或者grid更方便。
不过你既然问这个,那我就按float教你哈。

HTML代码

<head> </head> <body>
盒子1
盒子2
</body> </>
效果说明 1 . 我做了两个并排的盒子,一个蓝一个粉 2 . 每个盒子宽4 5 %,这样两加起来1 00%,中间留点间距 3 . 用了float: left让它们靠左排列 4 . 父容器加了clear: both清除浮动,不然会出bug
不过你想想,如果浏览器窗口太小,这些盒子会自动换行对吧?这时候用flexbox更好写:
css .container { display: flex; / 开启flex布局 / } .box { flex: 1 1 4 5 %; / 每个占4 5 %宽度 / margin: 1 0px; background-color: f0f0f0; border: 1 px solid ccc; }
这样写更通用,不用管清除浮动那些事。
但float是老技术了,很多旧浏览器都支持,你要考虑兼容性就选这个哈。