CSS 如何实现垂直居中图片弹窗的效果?

html-css028

CSS 如何实现垂直居中图片弹窗的效果?,第1张

在一个容器里再定义一个绝对定位的p容器,再在p容器里放需要垂直居中的图片,图片定义相对定位的CSS。直接上CSS代码:#pic{width:300pxheight:300pxbackground-color:greenborder:6pxsolid#ccctext-align:centerposition:relativedisplay:.

要div垂直居中,最好的方法就是让height和ling-height的数值一致.

比如

<div

style="height:30pxline-height:30px">

xxx

</div>

这样,里面的内容xxx就会垂直居中显示!

然后再使其水平居中,使用text-align

例子:

<div

style="height:30pxline-height:30pxtext-align:center">

xxx

</div>

这样,垂直+水平就居中了.line-height是css中能够方便设置字的垂直位置的好方法~!