【问题标题】:Responsive design with changes in CSS as opposed to HTML响应式设计与 CSS 的变化而不是 HTML
【发布时间】:2015-04-25 14:49:51
【问题描述】:

场景是我们正在使用托管大约 5-6 个站点的 CMS 第三方产品,并且在整个站点中使用了许多共享组件。

鉴于我们对产品的具体实施和定制,为给定网站应用/加载特定 CSS 是可行的,但对 HTML/组件进行更改更难,因为它们在许多网站上重复使用。

我们的团队希望只在其中一个网站上实现响应式设计,而不是全部,因此,在不考虑实现细节的情况下,作为一个可行性问题,是否可以使用 CSS 完全实现响应式网页设计仅,而不是使用移动优先或响应式框架,这需要修改 HTML 以适应其响应式类?

我不是网页设计方面的专家,但从我目前看到的情况来看,在响应式设计中,大部分实现都是使用 CSS 媒体查询,但可以 100% 完成,而不是依赖JS 上的任何响应式设计功能?

谢谢

【问题讨论】:

    标签: html css web responsive-design


    【解决方案1】:

    仅使用 CSS 就有很多工作要做。

    当然,选项和方法会因站点而异,具体取决于设计和基本代码。

    您可以添加 JavaScript 以获得平滑的效果(例如 Masonry),但大多数响应式网站,无论是移动版还是桌面版,都基于您提到的目标媒体查询。

    正如之前的评论者所说,如果您无法在 HTML 中添加样式自定义所需的类,则可能需要使用 !important 声明覆盖样式。

    或者.. 让所有网站都响应!现在是 2015 年 :)

    【讨论】:

      【解决方案2】:

      简短的回答是肯定的,我会说。几年前,还没有所谓的“响应式设计”或“移动优先”的概念,很多公司希望更新他们的网站以适应移动设备,他们也想降低成本,这基本上意味着 - 调整当前站点,而不是重新设计和重建。所以最简单的方法是保持一切不变,但添加一个移动样式表。我相信这种方法可以持续很长时间。

      只使用 CSS 是有限制的,你必须让客户理解它。基本上是说“该网站在移动设备上可能看起来并不完美,但它会更易于访问和使用。”对于开发人员和设计人员,我们必须说服自己接受我们所拥有的,并且在编写代码时我们所做的已经足够好。当然,花的时间越多越好看。但如果你推得太多,它可能是无穷无尽的。

      这里有一个提示 - 处理这种 CSS,不要害怕使用 !important 规则,例如将所有内容都放在 width: auto !importantfloat: none !important 等。这会让事情变得更容易。

      【讨论】:

        【解决方案3】:

        可能吗?当然。有多难?如果你已经有大量的 CSS,那可能会很痛苦……你可能只想考虑从头开始你的 CSS。使用 sass 之类的东西可能会让它变得不那么可怕。实际上,一切都取决于要求、团队的前端经验和截止日期。

        【讨论】:

        • 那么就绝对没有响应式设计功能只能通过HTML/JS来实现了吗?我想我的问题可以措辞更好:是否有任何响应式设计功能只能通过 HTML 或 JS 而不是 CSS 实现?
        • 暂时想不到
        • 仅供参考,您实施响应式网页设计的经验有多丰富?
        猜你喜欢
        • 1970-01-01
        • 1970-01-01
        • 2018-10-17
        • 1970-01-01
        • 2014-06-18
        • 2015-12-29
        • 2018-12-22
        • 2021-10-01
        • 1970-01-01
        相关资源
        最近更新 更多