【发布时间】：2015-09-02 04:36:01
【问题描述】：
我是编码新手，我创建了一个包含大量边距和填充值的网站。那么有没有一种合乎逻辑的方式让它响应？
【问题讨论】：
-
始终以使用百分比为目标。
-
欢迎来到 Stack Overflow。我们很乐意为您提供帮助。为了提高您获得答案的机会，以下是一些提示：How do I ask a good question?
【发布时间】：2015-09-02 04:36:01
【问题描述】：
在制作响应式网站时，边距和内边距并不重要。为了使网站具有响应性，其中一件大事就是将网站宽度设置为百分比。此外，找到一个好的框架可以帮助很多。我建议研究引导程序或基础。
【讨论】：
-
是的，我使用 Bootstrap 网格系统，但设计更直观。所以我不得不写边距和填充值。
您需要在 Bootstrap 断点内应用新的边距和填充。 只选择你需要的那个。
一些减少响应式代码量的技巧：
- 使用一个类名以相同方式调整大小的元素分组，然后仅对具有相同类名的组应用新的大小。
- 为列应用响应大小，例如
col-xs-12、col-sm-6、col-md-4 - 如果没有必要，不要为每个断点重新设置所有元素的样式。检查网站在大屏幕上是否看起来不错，然后调整浏览器大小并仅重新设置在小屏幕上中断的元素的样式。
- 将断点数量减少到最少，例如：1. 移动设备、2. 平板电脑、3. 台式机。
css:
/* Large Devices, Wide Screens */
@media only screen and (max-width : 1200px) {
}
/* Medium Devices, Desktops */
@media only screen and (max-width : 992px) {
}
/* Small Devices, Tablets */
@media only screen and (max-width : 768px) {
}
/* Extra Small Devices, Phones */
@media only screen and (max-width : 480px) {
}
/* Custom, iPhone Retina */
@media only screen and (max-width : 320px) {
}
【讨论】：
-
真的很有帮助。非常感谢！