在html中给出id和类的最佳方法

Question

所以我们假设我们有一个包含大量页面的大项目，我们必须添加一个html页面。

创建页面后，我看到我使用的一些id和类也出现在其他页面中。所以给那个id的css样式给我带来了很大的问题。 那么给出id和类的最佳方法是什么，项目中加倍的概率最小？

一种方法是向属性添加页面名称。所以，而不是

id="button"

我们将

id="mypage-button"

但是这样，id和类变得更大，更不易读。 另一种方法是在CSS中提供该组件的完整路径，并最小化标识符加倍的可能性。例如，而不是给出CSS

#myTable
{
height:300px;
}

现在我要给

#myBigDiv > #AnotherDiv .tables #myTable
{
height:300px;
}

但是这种方式比较慢，而且速度会慢很多。 将我自己的css文件放在我的页面中并不能解决问题，因为写了一些我不知道的属性在布局中给出的css文件中给出了任何其他属性（例如，margin）。 您怎么看？最好的方法是什么？

Answer 1

一种方法是在body标签中添加一个类。因此，通过上面的示例，您将使用

.myPage #button {}

Answer 2

我个人喜欢使用global.css，forms.css，然后为包含该页面特定CSS的单个页面分隔CSS文件。然后，可以使用一个简单的函数将这些页面添加到您的业务端。

Answer 3

如class="button page1"这样的多个类如何使用第二个类来指示页面（更容易创建自动创建页面），然后使用id和类的组合在css中

#button1.page1{
 somestyle
}

甚至更好地使用scss来编写css - 对于多页网站来说会更容易