用html5 css使两个模块并排显示代码
时间: 2024-03-19 08:44:30 浏览: 92
两个div并排的实现代码
可以使用以下 HTML 和 CSS 代码来实现两个模块并排显示:
HTML代码:
```html
<div class="container">
<div class="module1">
<!-- 模块1的内容 -->
</div>
<div class="module2">
<!-- 模块2的内容 -->
</div>
</div>
```
CSS代码:
```css
.container {
display: flex;
flex-wrap: wrap;
}
.module1, .module2 {
width: 50%;
padding: 10px;
}
.module1 {
/* 模块1的样式 */
}
.module2 {
/* 模块2的样式 */
}
```
这里使用了 flex 布局,并设置了容器的 flex-wrap 属性为 wrap,以便在窗口宽度不足时自动换行。模块1 和模块2 的宽度都设置为 50%,以使它们并排显示。可以根据需要调整模块的样式。
阅读全文