html - 是否有任何 Web 布局范例可以使 CSS 少一点……不可预测？

Question

促使我写这个问题的是，我真的很想制作外观漂亮的网站，但我绝对不喜欢 CSS。

我的感觉是，这全都与反复试验有关。我需要尝试做一些事情并在所有浏览器中测试、测试然后再次测试，毕竟我仍然觉得结果不是跨浏览器的。

我找不到一种方法来以易于阅读和跨浏览器的一致布局系统地转换想法。

所以我问你:是否有范例、分步指南或任何可以帮助我感觉我正在以正确的方式做事的东西？

Answer 1

使用Object Oriented CSS .他们的方法真的很有条理；仅通过查看标记就可以理解页面。布局组件特别好。

例如:

 <div class="line">
  <div class="unit size1of2">
    <h3>1/2</h3>
    <p>Lorem ipsum dolor sit amet...</p>
  </div>
  <div class="unit size1of2 lastUnit">
    <h3>1/2</h3>
    <p>Lorem ipsum dolor sit amet...</p>
 </div>
</div>

上面的标记是不是很有意义？您可以找到更多网格示例 here .

此外，您可能应该知道 OOCSS 是基于 YUI 库中的 CSS 重置样式表和字体构建的。尽管 OCSSS 没有定义真正的“样式”，但它为使您的 CSS 更具可预测性和一致性提供了良好的基础。