0

我当前的项目需要构建一个组件框架，这些组件将来会在独立品牌的网站上重复使用。这些组件被汇总到 ASP.NET 用户控件 ( *.ascx) 中。同一个组件将出现在多个品牌网站上，它们之间的唯一区别是内容和 CSS。我需要以这样一种方式构建 HTML，以便仅通过 CSS 为设计调整提供尽可能多的未来灵活性。这是一个例子。

假设我正在创建一个基本的标注组件来宣传某些东西。这对于语义和简单的 HTML 来说已经足够了：

<div class="callout">
  <h3>Headline</h3>
  <p>lorem ipsum...</p>
  <a href="#">Read more</a
</div>

但是，根据未来的设计变化，那里可能没有足够的 HTML 元素来编写 CSS 来匹配设计。也许我需要为未来的 CSS 皮肤过于冗长和超载，像这样：

<div class="callout-outer">
  <div class="callout-inner">
    <div class="callout-top">
      <h3>Headline</h3>
    </div>
    <div class="callout-body">
      <p>lorem ipsum...</p>
    </div>
    <div class="callout-bottom">
      <a href="#">Read more</a>
    </div>
  </div>
</div>

神圣的 divitis 蝙蝠侠！但实际上……第二个结构将为设计更改提供大量的未来 CSS 蒙皮灵活性，但在语义上它是垃圾。

我的问题：

  • 是否有任何样板框架已经具有这样的结构（我认为 Twitter Bootstrap 不会提供这么多的灵活性）
  • 这完全是一个可怕的想法吗？（主观的，我知道）
4

1 回答 1

1

这不是一个糟糕的主意 - 这是一个好主意，很多人最终得到的 HTML 看起来像这样：

我最初的想法是设计您的网站以使用JQueryUI样式，这迫使您考虑您给出的第二个示例，因为需要动画或结构化以支持基于 CSS 文件的重新换肤的概念。

但是，我会仔细考虑 DIV 的命名约定，外部和内部实际上是非常明智的 :)

  • JQuery UI 网站还为设计人员提供了一种很好的方式来改变网站的外观和感觉，而无需自己制作 CSS（并且之后仍然可以使其工作）。
于 2013-03-26T13:08:26.043 回答