/* 使用有意义的名称 */
.highlight {
background-color: yellow;
}
/* 避免单一名称 */
.btn {
font-size: 16px;
}
/* 使用连字符来代替下划线 */
.container-card {
margin: 20px;
}
/* 命名应该基于功能不是样式 */
.error {
color: red;
}
/* 使用BEM命名约定 */
.navbar__logo {
width: 100px;
}首先，命名应该使用有意义的名称。例如：使用highlight表示内容的高亮部分，而不是使用类似类名col-1这样的简单名称。这种名称可以更好地传达样式的用途，同时也让人更容易理解代码。
其次，避免使用单一名称。名称应该描述元素。例如，使用.button作为按钮的类名是不明确的，因为它只描述了一个按钮，并且无法分别描述不同类型的按钮。
然后，避免使用下划线。在CSS中，下划线有时被用于命名，但是它们可能与其他开发人员的命名约定发生冲突。因此，应该使用连字符代替下划线。
其次，命名应该基于元素的功能而不是样式。例如，对于表示错误的元素，应该使用类名.error，而不是红色字体的类名，因为这种错误可能不仅仅是显示为红色的字体，而是另外一些风格。
最后，建议使用BEM命名约定。BEM是块（Block）、元素（Element）、修饰符（Modifier）的缩写。使用BEM可以使CSS更易于维护，更模块化，更简单。例如，.navbar__logo是一个块元素，.navbar__logo–big是一个修饰符，用于需要更大的标志。