div层中图片垂直居中的css样式_html/css_WEB-ITnose
程序员文章站
2022-05-02 15:33:37
...
1、图片定义大小
.div{ border:1px solid #000;width:200px;
height:200px;position:relative;
}
.img {
position:absolute;
top:50%;
left:50%;
margin:-50px 0 0 -50px;
width:100px;
height:100px;
border:1px solid red;
}
2、图片不定义大小
利用定位来显示垂直局中的图片
.div{ border:1px solid #000;width:200px;
height:200px;position:relative;
}
.img {
position:absolute;
top:50%;
left:50%;
margin:-50px 0 0 -50px;
width:100px;
height:100px;
border:1px solid red;
}
2、图片不定义大小
固定高宽的容器中,图片垂直局中。
推荐阅读
-
怎样让DIV中的两个TEXTBOX垂直居中_html/css_WEB-ITnose
-
DIV中的文字下居中怎么设置_html/css_WEB-ITnose
-
div中有一个marquee标签,marquee中有滚动显示的文字,如何让文字在div中垂直居中从右向左滚动显示?_html/css_WEB-ITnose
-
为啥在IE6中,A标签中的文字不能垂直居中呢?_html/css_WEB-ITnose
-
我这个li中的文字为什么在chrome下无法垂直居中?_html/css_WEB-ITnose
-
为啥在IE6中,A标签中的文字不能垂直居中呢?_html/css_WEB-ITnose
-
IE8 如何让无序列表中的文字与里面的div在垂直方向都居中_html/css_WEB-ITnose
-
我这个li中的文字为什么在chrome下无法垂直居中?_html/css_WEB-ITnose
-
div中有一个marquee标签,marquee中有滚动显示的文字,如何让文字在div中垂直居中从右向左滚动显示?_html/css_WEB-ITnose
-
不知大家遇到过这种问题么,一个层宽度设为100%,并设置背景图片,在浏览器中浏览,缩小窗口到滚动条出现,然后拖动滚动条到右侧,右侧的区域变成空白,怎么解决?_html/css_WEB-ITnose