css选择器

ID选择器

#elem() id="elem"

1、ID是唯一值，在一个页面中只能出现1次

2、命名规范，由字母，下划线，中划线，数字，第一个不能是数字

类选择器

.elem() class="elem"

1、class选择器是可以复用的

2、可以添加多个class样式

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <style type="text/css">
            .IV{background-color: #008000;}
            .LL{font-size: 20px;}
            p.LL{font-family: "楷体";}
        </style>
    </head>
    <body>
        <div class="IV">这是一个块</div>
        <p class="IV LL">这是一个段落</p>
    </body>
</html>

层次选择器

后代选择器

N M

父子选择器

N>M

兄弟选择器（选择下面的选择器）

N~M

属性选择器

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <style>
            /* 选择div中所欲带class的标签 */
            div[class]{background-color: #FFFF00;}
            /* 选择div中所有class中带search字样的标签 */
            div[class*=search]{font-size: 22px;}
        </style>
    </head>
    <body>
        <div class="search">我是一个块1</div>
        <div class="search-butuuon">我是一个块2</div>
        <div class="box">我是一个块3</div>
        <div >我是一个块4</div>
        <div class="search-user">我是一个块5</div>
    </body>
</html>