bootstrap 图片自适应

作者: Moment929 | 来源:发表于2016-07-25 11:10 被阅读0次

    用bootstrap框架实现图片自适应:

    如果是在页面上插入图片,就直接加上 class="img-responsive"
    <img src="..." class="img-responsive center-block" >

    如果是在内容页里面的话,直接用js给每个img加上属性就可以了。

    $(".setting img").addClass("img-responsive center-block"); //center-block 图片水平居中

    在 Bootstrap 版本 3 中,通过为图片添加 .img-responsive 类可以让图片支持响应式布局。其实质是为图片设置了 max-width: 100%;、 height: auto; 和 display: block; 属性,从而让图片在其父元素中更好的缩放。

    谷歌应用翻译:: 划词翻译
    sublime Text 插件 空格提醒: Trailing Spaces

    相关文章

      网友评论

        本文标题:bootstrap 图片自适应

        本文链接:https://www.haomeiwen.com/subject/wapgjttx.html