html - 如何用 CSS 设置四个并行的 DIV？

Question

我搜索了教程，但它们只显示了如何设置三个并行 div。

是否可以更改此代码并放置 4 个并行 div？

<div style="width:90%;border:1px solid #000;">
    <div style="float:left; width:33.3%; background:#aaa;">one</div>
    <div style="float:left; width:33.3%; background:#bbb;">two</div>
    <div style="float:left; width:33.4%; background:#ccc;">three</div>
<div style="clear:both;"></div>

Answer 1

这是你想要的？

<div style="width:90%;border:1px solid #000;">
    <div style="float:left; width:25%; background:#aaa;">one</div>
    <div style="float:left; width:25%; background:#bbb;">two</div>
    <div style="float:left; width:25%; background:#ccc;">three</div>
    <div style="float:left; width:25%; background:#ddd;">four</div>
<div style="clear:both;"></div>

Answer 2

<div style="float:left; width:25%; background:#aaa;">one</div>
<div style="float:left; width:25%; background:#bbb;">two</div>
<div style="float:left; width:25%; background:#ccc;">three</div>
<div style="float:left; width:25%; background:#ddd;">four</div>

只需再添加一个 div 标签并将它们均分即可得到四个 div！