css - 重复 GUI 界面，做一点修改还是一个新的？

Question

我正在使用 HTML、Javascript 和 CSS 开发 Web 软件。现在我有几个 div s，每个都是一个功能的接口(interface)。其中一些完全相同，也许只是标题不同。所以我的问题是:我应该用一些代码更改现有的 div，还是一个新的 div，所有元素都在那里重复。哪个设计更好。我知道有一个原则叫DIY，我想遵循它。

Answer 1

最佳做法是重复您的 html...

<div class="module">
<h1>Title</h1>
<p>...</p>
</div>

<div class="module">
<h1>Another title</h1>
<p>...</p>
</div>

但不是你的 CSS:

.module {
width: 300;
float: left;
}

.module h1 {
font-size: 18px;
}

HTML 是一种标记语言，因此需要重复使用。事实上，这表明您正在正确地进行模块化。如果事情开始变得复杂(“该死，我需要在每个 div.module 中的每个 h1 下方放置一个 h2!”)您可以研究一种网络编程语言，然后应用 DRY 原则。