流体布局中的高度

Question

我正在尝试使用bootstrap设计流畅/响应式网页设计。我正在尝试设计布局，以便它适合许多设备。关于将高度设置为布局元素的问题，例如页眉或页脚。我现在已经以像素为单位，但我想知道我是否应该使用其他形式的测量。

我可能过度思考了这一点，但我想确保我这样做是正确的。提前谢谢！

Answer 1

尽可能避免设置height。您经常可以使用padding对相关元素和/或元素子元素的margin值进行处理 - 最好是这样。

如果你绝对需要定义一个高度，请使用min-height，这样它就会随着孩子占据更多的垂直空间而增长。

很多时候人们会回归定义静态height值，因为元素也使用float并添加高度以获取内容流和背景。这是相当糟糕的做法，如果是这种情况，你应该考虑研究methods of clearing floats。

Answer 2

如果您有许多不同的设备，可能像素是最佳选择。要考虑的其他测量：

• em （1em等于默认字体大小）
• ％（屏幕）

Answer 3

em和％是流体/响应式网页设计的理想解决方案。

我会建议媒体查询css

    @media only screen and (max-device-width: 480px) {

    }