Question

我试图制作一个固定大小的面板。我做错了什么？

<div class="panel panel-info">
            <div class="panel-heading" style="max-height: 5%">
                <h1 style="text-align: center">bbbbbb</h1>
            </div>
            <div class="panel-body">
            </div>
    </div>

Answer 1

如果您将最大宽度添加到面板应该可以使用，您可以在下面看到最大宽度为50％。如果你想让它以像素为单位固定，只需使用max-height：100px即可。此外，如果您希望它相对于屏幕的大小，您可以尝试使用vh作为高度。您可以将其添加到面板，面板标题或面板主体以获得所需的高度。 1vh单位反映视口高度的1/100。有关vh / vw的更多信息，请访问：http://snook.ca/archives/html_and_css/vm-vh-units

如果您选择使用vh，则应添加最小高度vh，以便在较低分辨率下不会太小。

<div class="panel panel-info" style="max-width: 50%;">
    <div class="panel-heading" style="max-height: 1vh">
        <h1 style="text-align: center">bbbbbb</h1>
    </div>
    <div class="panel-body">
    </div>
</div>

max / min-height / width对bootstrap容器没有任何影响

1 个答案: