float属性可以控制页面是否浮动,以及浮动的方式。这里需要说明的是,如果被定义成绝对定位(position:absolute),则会忽略float的浮动类型。
控制页面浮动方式的float属性包含下面4种值:
float:{ left | right | none | inherit }
代码
<div class="nav">
<a href="home">首页</a>
<a href="about">关于我们</a>
<a href="contact">联系我们</a >
</div>
为了方便演示,我们定义了body的背景颜色、宽度、行高、边距等。
body{
line-height: 160%;
width: 468px;
margin-right: auto;
margin-left: auto;
margin-top: 60px;
background-color: #003366;
}
//定义类nav的浮动方式。
.nav {
background-color: #FFFFFF;
float: left;
width: 200px;
padding: 10px;
}