Bootstrap   发布时间:2022-04-18  发布网站:大佬教程  code.js-code.com
大佬教程收集整理的这篇文章主要介绍了Bootstrap图像调整为小屏幕调整大小,不起作用大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
我正在尝试使用Bootstrap调整图像大小.我有一个足够大的徽标,适用于大屏幕和决议.显然,图像应该在所有分辨率(小和大分辨率)中都能很好地调整大小.
我使用了Bootstrap的.img响应类来使图像响应.很明显,图像在大分辨率下显示得很好,但图像在较小的分辨率下会变小.问题是 – 图像在较小的分辨率下不会变小.
任何帮助将受到高度赞赏.

<BODY>
    <nav class="navbar navbar-default">
        <div class="container-fluid">
           <div class="navbar-header col-xs-3 col-md-3"> 
               <a class="navbar-brand" href="#">
                   <img class="img-responsive" src="someimage.png">
               </a> 
           </div> 
           <div class="col-xs-9 col-md-9"> 
               <ul class="nav navbar-nav navbar-right"> 
                   <li><a href="#"><img class="img-responsive" src="A1.png"></a></li> 
                   <li><a href="#"><img class="img-responsive" src="A2.png"></a></li> 
               </ul> 
           </div> 
         </div> 
    </nav> 
</BODY>

解决方法

我认为你问题的根源在于你期望.img响应类会自动使你的图像对于较小的屏幕变小,这并不是它的工作原理.

它实际上适用于max-width:100%;和身高:汽车;对于图像,即如果它是宽图像,它将不会比它的父图像宽. http://getbootstrap.com/css/#images

希望这可以帮助

大佬总结

以上是大佬教程为你收集整理的Bootstrap图像调整为小屏幕调整大小,不起作用全部内容,希望文章能够帮你解决Bootstrap图像调整为小屏幕调整大小,不起作用所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。