CSS中如何剧中?

html-css011

CSS中如何剧中?,第1张

两种方法。

一,设置两个div容器,将外面一个设置一下属性,text-align:center,再将里面一个设置以下属性margin:0 auto;这样可以兼容ie与ff的浏览器,不过缺点是所有内容由于设置了text-align:center所以将全部居中显示,可以额外设置属性解决,

二,设置一个div容器,为其设置一下属性:position:absolute;left:50%;margin-left:-你的容器宽度的一半,

记得最后一个属性设置你容器宽度的一半,并且为负数,这样将避开浏览器的兼容问题。

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>

1.这三个div的css都设置上margin:0 auto

2.然后,在他们外面加个div框住他们,外面这个div的css设上text-aling:center

只写margin:0 auto在ie下没用的,ie下靠的是text-align:center