HTML5中class属性用于样式控制和JavaScript操作，需在起始标签内以空格分隔多个合法类名；CSS用“.类名”选择器复用样式；应语义化命名并避免冲突；JavaScript可通过classList动态增删切换单个或多个类。
在HTML5中，为元素定义class属性是实现样式控制和JavaScript操作的基础手段。class属性用于为一个或多个HTML元素指定一个或多个类名，这些类名可被CSS选择器引用以统一设置样式，也可被JavaScript通过getElementsByClassName等方法批量获取。以下是具体定义方式与规范：
一、在起始标签中直接添加class属性
class属性必须写在HTML元素的开始标签内，其值为一个或多个由空格分隔的合法类名。类名需符合标识符规则：只能包含字母、数字、下划线（_）和短横线（-），且不能以数字开头。
1、打开HTML文件，在需要设置样式的元素起始标签内插入class属性，例如
2、若需赋予多个类名，用空格分隔，例如
。
立即学习“前端免费学习笔记（深入）”；
3、确保类名不包含空格、制表符、换行符或中文字符，class="my class"为非法写法。
二、使用class属性配合CSS选择器应用样式
CSS通过点号（.）加类名的方式定义样式规则，一个class样式可同时作用于所有拥有该类名的元素，实现样式复用与结构分离。
1、在
2、在HTML中对应元素上设置class="container"，如
3、浏览器解析时自动将该CSS规则应用于所有class属性包含container的元素，无需重复声明样式代码。
三、避免class命名冲突与语义混淆
class名应具有描述性与功能性，避免使用表现性词汇（如red、big）或过于宽泛的名称（如box、item），以提升可维护性与团队协作效率。
1、优先采用语义化命名，例如使用.nav-menu而非.blue-bar。
2、对复合功能组件采用BEM风格命名，如.card__title表示card组件下的标题元素。
3、禁止在同一个元素的class属性中重复填写相同类名，class="btn btn btn"不会增强效果，仅等效于class="btn"。
四、动态修改class属性的JavaScript方法
通过DOM API可运行时添加、删除或切换class，适用于交互反馈、状态变更等场景，无需刷新页面即可更新样式表现。
1、使用element.classList.add("active")向元素添加指定类名。
2、使用element.classList.remove("hidden")移除已有类名。
3、使用element.classList.toggle("expanded")在存在时删除、不存在时添加，适用于折叠/展开按钮的状态切换。
