Question

这是我的css，用于处理我页面上的图像：

.img-responsive {
    display: block;
    max-width: 10%;
    height:400px important!;
    margin-left: 33%;
    margin-top: 7%;
    height: auto;
}

随着我增加或减少宽度，它反映良好。但改变宽度不会产生任何影响。

如何在此处手动增加或减少图像宽度？ css代码在index.php本身作为内联css。

我想增加宽度不得增加图像的高度

Answer 1

如果我没弄错，我希望增加宽度不得增加图像的高度意味着你想要一种方法来改变图像的宽度，同时保持高度不变。如果您对通过CSS执行此操作感到满意，可以将图像包装在封装div中，控制div的大小，然后告诉图像完全填满div。

代码归结为：

<head>
    <style>
        .img-responsive {
           height:100%;
           width:100%;
        }

      .image-container
      {
        width:250px;
        height:140px;
      }
    </style>
</head>
<body>
    <div class="container image-container">
      <img src="http://www.menucool.com/slider/prod/image-slider-4.jpg" class="img-responsive" />
    </div>
</body>

如果更改图像容器类的宽度或高度属性，您将看到图像相应地伸展。

在bootstrap css图像中调整高度

1 个答案: