CSS 基础学习-005 CSS样式类选择器

由 hrs, 29 三月, 2021

类选择器就是利用class属性为html元素定义一个属性值，然后在css样式表中引用属性值来设置css样式。

实例代码：

  1 <!doctype html>
  2 <html>
  3   <head>
  4     <meta setchar="utf8">
  5     <style>
  6     .center{
  7         color:red;
  8         text-align:center;
  9 
 10       }
 11       h1{
 12         text-align:center;
 13       }
 14     </style>
 15 
 16   </head>
 17   <body>
 18     <h1 >这是一个类实例</h1>
 19 
 20     <h1 class="center">居中的红色标题</h1>
 21     <p class="center">居中的红色段落</p>
 22   </body>
 23 </html>

运行效果：

css-005.png

从这个实例我们为h1  和 P 元素进行class设置，设置名称为center ，之后我们为这个属性进行居中对齐和字体红色设置。

标签

评论