写一个横排六个格子的html
时间: 2023-07-31 12:07:25 浏览: 196
html使用图片、列表和CSS实现图文横排-具有滚动效果
可以使用以下代码:
```html
<div style="display: inline-block;">
<div style="width: 50px; height: 50px; border: 1px solid black;"></div>
<div style="width: 50px; height: 50px; border: 1px solid black;"></div>
<div style="width: 50px; height: 50px; border: 1px solid black;"></div>
<div style="width: 50px; height: 50px; border: 1px solid black;"></div>
<div style="width: 50px; height: 50px; border: 1px solid black;"></div>
<div style="width: 50px; height: 50px; border: 1px solid black;"></div>
</div>
```
其中,`display: inline-block` 的作用是让六个格子横排显示;每个格子的大小可以根据实际需要进行调整,这里设置了宽度和高度均为 50px,并且添加了黑色边框,以便区分格子之间的界限。
阅读全文