css怎么设置图片位置居中


当前第2页 返回上一页

c5904eee56b05004e653f6de26f65f6.png

(学习视频分享:css视频教程)

3、图片外面用个p标签,通过设置line-height使图片垂直居中:

html代码如下:

1

2

3

<div class="img_wrap">

    <p><img src="wgs.jpg"></p>

</div>

css代码如下:

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

*{margin: 0px;padding: 0px}

.img_wrap{

    width: 400px;

    height: 300px;

    border: 1px dashed #ccc;

    text-align: center;}

.img_wrap p{

    width:400px;

    height:300px;

    line-height:300px;  /* 行高等于高度 */

}

.img_wrap p img{

    *margin-top:expression((400 - this.height )/2);  /* CSS表达式用来兼容IE6/IE7 */

    vertical-align:middle;

    border:1px solid #ccc;

}

效果图如下:

9eb73dcae364463ecbc6b4921f78995.png

相关推荐:CSS教程

以上就是css怎么设置图片位置居中的详细内容,更多文章请关注木庄网络博客

返回前面的内容

相关阅读 >>

css标准模型包含外边距吗

css不能居中怎么办

css怎么设置a标签颜色

css中border是什么意思

css怎么旋转图片

一分钟了解css的主要功能

css绝对路径怎么写

如何清理无用的css样式,你知道吗?

css怎么限制文本字数

css怎么让图片不变形

更多相关阅读请进入《css》频道 >>




打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,您说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

分享从这里开始,精彩与您同在

评论

管理员已关闭评论功能...