在前端开发中,经常出现需要将一个页面分为两列的情况,而这两列的宽度是固定的。使用CSS能够轻松地实现这一功能。 首先,我们需要在HTML中创建两个div元素,分别表示两列。代码如下: <
<div class="left-column">
// 左侧列的内容
</div>
<br>
<div class="right-column">
// 右侧列的内容
</div>
.left-column {
float: left;
width: 200px;
}
<br>
.right-column {
float: left;
width: 800px;
}
<div class="left-column">
// 左侧列的内容
</div>
<br>
<div class="right-column">
// 右侧列的内容
</div>
<br>
<div class="clear"></div>
.left-column {
float: left;
width: 200px;
font-size: 14px;
color: #333;
line-height: 1.5;
}
<br>
.right-column {
float: left;
width: 800px;
font-size: 16px;
color: #666;
line-height: 1.8;
}
粉丝
0
关注
0
收藏
0