.box{
float:left}//向左浮动显示了
.box{float:right}//向右浮动显示了
.box{width:980px
margin:0px
auto}//居中显示了
.box{margin-top:5pxmargin-bottom:5pxmargin-left:5pxmargin-right:5pxpadding-left:5px}这个前面的分别是外面距,距上,下,左,右,后面是内边距距左,其它的也一样子的道理
在HTML调用有两种方法,第一种,直接把这个写在html的head文件里面,
在这里是CSS代码
,或者直接建CSS文件,把代码写里面,在HTML引入,
靠左(默认值,可以省略):text-align:left
靠右:
text-align:right
居中:
text-align:center
1、居左:
对要靠左对齐(局左)的div样式加float:left。
示例代码:
css部分:
<style>
.divcss5-left{float:leftwidth:250pxheight:50pxborder:1px solid #F00}
</style>
HTML部分:
<div class="divcss5-left">此DIV靠左对齐显示</div>
2、居右:
对要靠右对齐(局右)的div样式加float:right。
示例代码:
css部分:
<style>
.divcss5-right{float:leftwidth:250pxheight:50pxborder:1px solid #F00}
</style>
HTML部分:
<div class="divcss5-right">此DIV靠右对齐显示</div>
3、居中:
对要居中对齐的div样式加margin:0 auto,不再需要加float样式。
示例代码:
css部分:
<style>
.divcss5-cent{margin:0 autowidth:250pxheight:50pxborder:1px solid #F00}
</style>
<div class="divcss5-cent">此DIV居中右对齐显示</div>
扩展资料:
CSS清除浮动:
浮动:因为使用了float:left或float:right或两者都是有了而产生的浮动。
对父级设置适合CSS高度:
对父级设置适合高度样式清除浮动,一般设置高度需要能确定内容高度才能设置。
示例代码:
css部分:
.divcss5{ width:400pxborder:1px solid #F00background:#FF0 height:102px}
.divcss5-left,.divcss5-right{width:180pxheight:100px
border:1px solid #00Fbackground:#FFF}
divcss5-left{ float:left}
.divcss5-right{ float:right}
HTML部分:
<div class="divcss5">
<div class="divcss5-left">left浮动</div>
<div class="divcss5-right">right浮动</div>
</div>