创建专业的响应式页面答案

【问题标题】：creating professional responsive page创建专业的响应式页面
【发布时间】：2015-04-15 02:25:14
【问题描述】：

创建与所有当前使用的浏览器兼容的现代响应式页面的流程和最佳实践是什么？我见过超过 250kb 的 csses，所以我不相信它们是从头开始手写的。你使用一些生成器或页面构建器吗？那么它实际上是什么样子的呢？如何轻松使它成为便携式？例如圆角半径等？从创建 html 标记开始？然后添加css库？什么图书馆？有什么重置css的吗？粗鲁？或者也许是 js 库？何时添加@media？你是为移动分辨率写的吗？还是您自上而下地写，在添加每个元素后测试所有分辨率？仍然广泛使用的 IE8 呢？

谁能描述创建专业响应式跨浏览器网页的完整制作过程？

【问题讨论】：

您的问题有很多组成部分。我会阅读更多内容并尝试提出更具体的问题。已经有很多关于这个主题的文章和教程。 Smashing Magazine 有一个很好的入门指南smashingmagazine.com/responsive-web-design-guidelines-tutorials。我还会研究像引导程序和基础这样的框架。我认为没有必要重写轮子来制作响应式列。
真的。有很多问题。但从全新技术开始的问题是缺乏道路。我已经阅读了有关基础、引导程序、sass 的信息，也看过一些关于 RWD 的教程，但是每个教程都只展示了一小步，没有按顺序排列。这就是为什么最好从非常高的角度了解整个过程的样子
从像 Bootstrap 或 Foundation 这样的框架开始，它们往往会决定您将使用哪些其他工具/方法（即 SASS/SCSS 或 LESS）。 Bootstrap 3.x 仍然支持 IE8，但有传言称 4.x 将放弃对 8 的支持。就我个人而言，我认为现在我的网站访问者并没有广泛使用它（不到 1%），但我想这可能会有所不同取决于地理位置和人口统计数据，例如年龄和消费者受众与企业。有太多变数可以说只有一种生产流程甚至最佳实践。

标签： html css responsive-design cross-browser

【解决方案1】：

有很多库，但正如您所说，您可以轻松地增加很多您可能不需要的额外内容。

我个人为一个完整的桌面宽度编写代码并缩小浏览器的大小，同时调整我的代码。

当我第一次查找如何进行 RWD 时，这篇文章就是我开始所需要的全部内容 - http://webdesignerwall.com/tutorials/responsive-design-in-3-steps

我更喜欢从头开始编写，而不是使用现有的库，但每个人都有自己的偏好。我喜欢完全控制我的代码，所以我知道所有东西在哪里以及它在做什么。

RWD 绝对是一门艺术，要真正精通它需要时间。

综上所述，请记住，Stack Overflow 旨在帮助解决编码问题。您的问题非常主观且基于意见。

【讨论】：