Question

是否有办法让面板将面板的宽度缩小到内容的宽度。我希望让面板在主体中包裹一个图像，然后在页脚中添加标题，但我不喜欢跨越周围容器div的整个宽度的面板。

我目前使用的html是：

<div class="panel panel-default">
  <div class="panel-body">
    <img class="img-responsive img-rounded center-block" alt="some alt text" src="a_path_to_a.jpg" />
  </div>
  <div class="panel-footer text-venter">A caption describing the image above.</div>
</div>

我对其他想法持开放态度，我不熟悉bootstrap和Web开发。

Answer 1

如果要将div宽度设置为图像宽度，请使用javascript或jquery。

这是我设置所有div的示例代码，其中类面板设置为内部img宽度。我希望能有所帮助。

<script type="text/javascript">
    $(document).ready(function () {
        var actualImgWidth = 0;
        $(".panel").each(function () {
            actualImgWidth = $("img", this).width();
            $(this).width(actualImgWidth);
        });
    });
</script>

将面板宽度缩小到内容宽度

1 个答案: