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

html-css07

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

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

CSS部分

div{

width: 400px

height: 400px

border:1px solid red

float: left

}

body:hover .box{

display: block

}

.box{

width: 200px

height: 200px

background: red

display: none

}

html部分

<div  >

<div class="box">

</div>

</div>