CSS中有许多连接盒子的方法,其中float和position是主要的两个方法。下面我们将介绍这两种方法如何使用。1. 使用float.box1 { width: 50%; height: 200px
CSS中有许多连接盒子的方法,其中float
和position
是主要的两个方法。下面我们将介绍这两种方法如何使用。
1. 使用float
.box1 { width: 50%; height: 200px; float: left; background-color: blue; } .box2 { width: 50%; height: 200px; float: right; background-color: red; }
上面的代码中,我们使用了float
属性将两个盒子分别向左和右浮动。这意味着它们将并排在一起。
2. 使用position
.box1 { width: 50%; height: 200px; position: absolute; left: 0; background-color: blue; } .box2 { width: 50%; height: 200px; position: absolute; right: 0; background-color: red; }
上面的代码中,我们使用了position
属性将两个盒子分别固定在页面的左右两侧。这意味着它们将一直保持在这个位置,并且如果页面滚动,它们将不随之移动。
粉丝
0
关注
0
收藏
0