html - 如果我为常见的 css 样式设置创建类并将它们分配给 html 元素，这是一个好习惯吗？

Question

这是我的代码:

样式.css

.background-cover{background-size:cover; background-position:center;}
.op-1{opacity:0.1;}
.border-3-solid{border-width:3px; border-color: solid;}
.border-black{border-color:#000;}
.full-width{width:100%;}

index.html

    <div class="full-width background-cover op-1 border-3-solid 
border-black" style="background-image:url('imageurl.png')"></div>

在很长一段时间内，每个元素使用更多的类会成为一个问题吗？ 我应该创建像这样的更通用的实用程序类，还是只为每个元素定义样式并使用较小的类？

Answer 1

如果您的元素很大，使用更多的类可能会很麻烦。好处是你应该将常用的样式和属性分组到一个类中，然后在你的 HTML 页面上使用它们，这样你的应用程序就会有一个坚实的外观并且你可以在将来轻松地修改/编辑它们。通过这种方式，您还可以通过使用元素的 id 调用它们，在样式表上定义额外的填充和其他小的更改，因此您的代码看起来更清晰，更易于阅读。