css - 如何将图像放入 Bootstrap 面板主体

Question

如何使图像适合 Bootstrap 面板主体？ 我正在使用 img 标签。我试着做 max-height:100% 和 max-width: 100% 但没有运气。 有没有办法在不指定实际高度和宽度的情况下使图像适合面板主体。 以下是我的代码:

<div class="jumbotron">
<div class="container" id="project_info">



    <div class="row">
    <div class="col-sm-4">

            <div class="panel panel-default">
                <div class="panel-heading">Medical Data Visualization</div>
                <div class="panel-body">
                    <img src="resource/Medical_visualization.jpg" class="img-rounded" id="Panel_Image">
                </div>
            </div>


    </div>
    </div>
</div>
</div>

谢谢…………

Answer 1

你可以使用bootstrap的img-responsive类

<div class="panel-body">
                    <img class="img-responsive" src="resource/Medical_visualization.jpg" class="img-rounded" id="Panel_Image">
                </div>