html - 不良做法 HTML/CSS 包装器

Question

对于我目前正在尝试制作的网站，我有多个具有不同结构的页面。我目前将所有 HTML 元素都放在这样定义的包装器中:

<div class="wrapper">

我一个页面对应的css如下

    .wrapper{
    display: grid;
    grid-template-columns: 5% 45% 45% 5%;
    grid-template-rows: 5% auto 5%;
    width: 100;
    margin: auto auto;
}

然而，对于另一个也将其内容包装在同一个包装器中的页面，我想使用不同的网格布局。为了解决这个问题，我考虑为每个网站制作一个不同的包装器类，例如

<div class="wrapperhome">
<div class="wrappercontact">

然后相应地更改css。

我对包装器的使用不是很有经验，我想知道这是否是一种不好的做法，或者是否有更好的方法来处理这个问题。

Answer 1

TBH，我认为这并不重要。但是关于寻求最佳实践，我觉得你。

我会使用不同的类，.wrapper对于通用属性，如果某个页面需要一些不同的属性，.wrapper-home并扩展(必要时甚至覆盖).wrapper那里有 s 属性。

然后你可以使用<div class="wrapper wrapper-home"></div> .