Maison > interface Web > tutoriel HTML > 图片在div里边水平 垂直 居中_html/css_WEB-ITnose

图片在div里边水平 垂直 居中_html/css_WEB-ITnose

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB
Libérer: 2016-06-24 12:25:36
original
1136 Les gens l'ont consulté



我想让图片在蓝色框里边,水平垂直居中,该怎么办?





回复讨论(解决方案)


我现在只能水平居中
 .pic_upload 是div css

 .pic_upload {     width:180px;     height:180px;     float:left;     margin:20px 0 0 20px;     border:2px solid #5FA9E1;     background-color:#F3F3F3;     }        .pic_upload  img {display:block; margin:0 auto;}
Copier après la connexion

table
这个时候就体现出table的好处了

.pic_upload {     width:180px;     height:180px;     float:left;     margin:20px 0 0 20px;     border:2px solid #5FA9E1;     background-color:#F3F3F3;     position:relative;/*使图片相对这个div绝对定位*/     }.pic_upload img {    margin: auto;	position: absolute;	top: 0;	left: 0;	bottom: 0;	right: 0;}
Copier après la connexion
Copier après la connexion

这样是不是可以...

.pic_upload {     width:180px;     height:180px;     float:left;     margin:20px 0 0 20px;     border:2px solid #5FA9E1;     background-color:#F3F3F3;     position:relative;/*使图片相对这个div绝对定位*/     }.pic_upload img {    margin: auto;	position: absolute;	top: 0;	left: 0;	bottom: 0;	right: 0;}
Copier après la connexion
Copier après la connexion

这样是不是可以...

谢谢啊!!  可以了!

恩恩,嘿嘿。

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal