首页 > 代码库 > css入门之css选择器

css入门之css选择器

CSS选择器

css的选择器最常用的是class选择器,定义方式如下。

 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>css选择器</title>
    <style>
        .c1{
            height: 48px;
            width: auto;
            border: 1px solid red;
            font-size: 16px;
            text-align: center;
            line-height: 48px;
        }
    </style>
</head>
<body>
<div class="c1">样式测试</div>
</body>
</html>

在head标签内的style中定义好class选择器后,在body内的其他标签中引用,引用方式为class="选择器名"。 建议使用这个选择器。

 

其他的选择器

ID选择器

#i { }     #括号内定义样式,#i中的#号并不是注释,它代表的是ID选择器

<div id="i">样式测试</div>    #引用ID选择器中的样式

 

标签选择器

div {}     #你也可以把div换为其他的标签

此标签选择器默认所有的div标签都会引用

 

其余还有更不常用的层级选择器,组合选择器,属性选择器,想要了解的自行百度。

css入门之css选择器