# class類型選擇器 ###### tags: `Html 選擇器` ```htmlembedded= <title>class类型选择器</title> <style type="text/css"> .class01{ color: blue; font-size: 30px; border: 1px solid yellow; } .class02{ color: gray; font-size: 26px; border: 1px solid red; } </style> </head> <body> <!--class 类型选择器的格式是： .class 属性值{ 属性：值; } class 类型选择器，可以通过class 属性有效的选择性地去使用这个样式。--> <!-- 需求1：修改 class 属性值为 class01的 span 或 div 标签，字体颜色为蓝色，字体大小30个像素。边框为1像素黄色实线。 需求2：修改 class 属性值为 class02的 div 标签，字体颜色为灰色，字体大小26个像素。边框为1像素红色实线。 --> <div class="class01">div标签class01</div> <div class="class02">div标签</div> <span class="class01">span标签class01</span> <span>span标签2</span> </body> ``` ![](https://i.imgur.com/7fgE7Br.png)