【问题标题】:Has anyone combined OOCSS with another grid framework?有没有人将 OOCSS 与另一个网格框架结合起来?
【发布时间】:2011-07-31 11:52:31
【问题描述】:

我对使用 Nicole Sullivan 的 Object-Oriented CSS 哲学/编码方法/其他的好处感到满意。特别是,我热衷于在我目前正在构建的站点中使用诸如“media block”之类的原则。

但是,它与流式网格系统捆绑在一起,我们的设计师目前正在构建严格的960 grid 宽度系统。 960 网格系统使用固定的 12 或 16 列布局,每个由 40 或 60 个像素组成。 OOCSS 将布局分成 1/2、1/3、1/4 或 1/5 部分的流体分区。

960.gs 具有内置于列之间的固有“装订线”边距,每列 10 像素。 OOCSS 在列之间没有边距,因为它们可以是任意宽度,而是在内容元素之间提供边距,以便分隔内容和容器。

在我们公司的 CSS 样板文件中混合和匹配这两个框架中最好的一个是不是一个坏主意? OOCSS 网格框架的流动性是否使其不适合刚性 960 页面宽度?我们也在使用 HTML5 样板。

我问这个问题是因为我已经发现,在尝试将某些框架与 OOCSS(例如 SASS)合并时,两种方法可以相互正交,最好只选择一个并坚持使用它 - 但这可能并非总是如此。

【问题讨论】:

    标签: css grid 960.gs oocss cascade-framework


    【解决方案1】:

    两个在整个框架中应用 OOCSS 原则的 CSS 框架:

    AFAIK,Cascade 框架是唯一包含 media object implementation fully integrated into the grid 的 CSS 框架。这使得 Cascade Framework 的网格系统成为所有 CSS 框架中最灵活的网格系统。

    其他一些框架正在慢慢采用 OOCSS 概念,通常包括媒体对象作为单独的 UI 元素。例如,查看 Bootstrap's implementation

    【讨论】:

      【解决方案2】:

      网格系统的主要优点是它为您的页面提供了视觉上的统一性——您在整个过程中都有一致的划分。我会犹豫使用两个不同的网格,因为这意味着您正在使用两组不同的线,从而导致一致性大大降低。此外,如果这些网格系统不是为了相互配合而构建的,那么混合它们可能会对某些边缘情况(甚至是正常情况)产生令人惊讶的效果。您不希望在一个项目工作一个月后遇到这种情况,并且不得不撕掉其中一个。

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 1970-01-01
        • 2017-10-16
        • 1970-01-01
        • 2016-06-16
        • 2011-08-24
        • 2015-04-05
        • 2013-06-03
        • 1970-01-01
        相关资源
        最近更新 更多