保证金/填充或位置,哪一个最适合响应式设计?

时间:2016-12-19 07:43:45

标签: css css3 media-queries

我总是感到困惑的是,我应该选择在使网页响应时的边距或位置(相对,绝对)。

例如,我有一个HTML元素,现在要正确对齐它,我可以选择边距/填充或位置,但我总是认为哪个更好用,所以我不必为不同的设备写很多媒体查询。

任何帮助/建议都是令人难以置信的!!!

3 个答案:

答案 0 :(得分:1)

每个属性都有自己的用例。但在反应敏锐的角度 我觉得填充更有助于在某些情况下你只需要填充而不是元素的高度和宽度。

位置/保证金相对/ abs完全取决于要求。 之后你也可以使用%和em。

答案 1 :(得分:1)

对我来说,绝对位置和使用左上角等是很麻烦的,特别是你会像我的帖子那样在2 div / section之间做浮动事情:

The never answered question

与边距和填充相同,你应该知道你自己的宽度和高度div,但是当你变成一个响应时它会太复杂,你应该再次设置你的宽度和高度。

做响应式网站的最佳方式我认为你应该遵循网站结构。保持在包装div或部分内。

为了创建移动视图或响应式设计,您需要精彩的媒体查询订单,它可以帮助您适应常规屏幕设备,如(iphone 5,6或ipad),但您必须考虑现在市场在机器人。和Android手机增长如此之快,你无法了解分辨率是什么(你不会随着时间的推移更新你的媒体查询?)。

  1. 自举 它没有类型,但它只有12个网格系统,你不能用7菜单管理导航,你应该自己修改它。
  2. Flexbox的 flexbox很好,你可以维护你的容器,你不需要使用浮动和清除它们。
  3. 像我说的那样,这取决于你的媒体查询。它不是关于位置或边距/填充,而是关于css中的所有内容。

    如果你的问题只是关于对齐,你可以开始在父div或部分中使用带有justify-content和align-items的display flex,这样你就不会打扰你的父div和#div;的宽度和高度。

    欢呼,可能有助于理解:)

答案 2 :(得分:0)

响应式设计的位置并不好。它很有用,但不建议用它来代替边距/填充。

例如,当您对元素使用position:absolute;时,它会将该元素从正常内容流中移出,并仅根据其相对定位的父元素调整其位置。如果你经常使用它,它会给你带来麻烦。

响应式设计是关于使用float

在空头头寸不能代替保证金/填补。