css 文本图片垂直居中显示,CSS控制DIV文本和图片水平居中和垂直居中

1、在div css布局中，最常见的问题就是div如何居中的问题。主要利用两个属性来使div居中：

body {TEXT-ALIGN: center;}

#center { MARGIN-RIGHT: auto; MARGIN-LEFT: auto; }

首先在body内容区域内定义文本居中，这样所有在body父级元素内的内容就会居中。对于ie浏览器这样设置就可以了，但是火狐浏览器还必须加下面这句，左右让它自动来实现居中。总之，加上这两个css样式就可以实现居中了。不过不建议大家在书写div的时候都嵌套在一个div里，这样如果网页内容过多的话会影响打开速度。可以分开写每个div，然后在需要居中的地方加上MARGIN-RIGHT: auto; MARGIN-LEFT: auto; 就可以了。

2、在div中如何使图片垂直居中

不提倡直接把图片写在网页文件中，应该用背景的方法来实现。例如：

body{BACKGROUND: url(/images/logos.gif) #FFF no-repeat center;}

关键就是最后的center,这个参数定义图片的位置。还可以写成“top left”(左上角)或者”bottom right”等，也可以直接写数值”50 30″。通过调节间距实现居中。

3、在div中如何使文本垂直居中

使用文本就不能再用图片了，这时可以用增高行距的办法变通实现垂直居中

文本垂直居中，背景图片居中

说明：

vertical-align:middle;表示行内垂直居中，我们将行距增加到和整个DIV一样高 line-height:200px; 然后插入文字，就垂直居中了。

垂直居中，也可用如下方法：

align {

text-align:center center;

}

或

align {

text-align:50% 50%;

}