为了防止浏览器宽度变化影响内容的显示 通常会这样做
<body>
<div class="wrapper">
……
</div>
</body>
.wrapper {
width:960px;
margin:auto;
}
这样内容就有了一个固定的宽度 而且能居中显示
当窗口宽度小于960px就要考虑响应式布局了
CSS定位默认static布局 按照从上往下排列
relative是相对于static布局设置位置
absolute是确切位置
fixed是固定位置 网页滚动时不会移动
box1浮动 box2不浮动 那么box2会呆在默认的位置 无视box1的存在：
<body>
<div class="box1"></div>
<div class="box2"></div>
</body>
.box1 {
float:right;
width:80px;
height:80px;
background-color:red;
}
.box2{
width:80px;
height:80px;
background-color:green;
}
box1浮动 box2浮动：
.box1 {
float:right;
width:80px;
height:80px;
background-color:red;
}
.box2{
float:right;
width:80px;
height:80px;
background-color:green;
}
Keep Going
时间： 2024-10-12 11:07:26