关于html中img的一些知识点

最新推荐文章于 2023-02-25 13:48:19 发布

allenmu1982

最新推荐文章于 2023-02-25 13:48:19 发布

阅读量164

点赞数

原文链接：http://www.cnblogs.com/qianxunpu/p/9234757.html

版权

<img> 标签的 height 和 width 属性设置图像的尺寸。

响应式图像

div或img图片高度随宽度自适应

例子，这个图像的大小是150px*150px。现在我们让他自适应于父级元素box的大小

html：

<div class="wrap">
    <div class="box">
        <img class="img-responsive" src="assets/images/wap150.png"/>
    </div>
    <span>武汉岩海官方微信</span>
</div>

css清单:

 .wrap{
            width:120px;
            text-align: center;
        }
        .box{
           width:70px;
            margin:0 auto;

        }
        span{
            font-size:13px;
        }
        .img-responsive{
            display:inline-block;
            height:auto;
            max-width:100%;
        }