html5类选择器 html类型选择器

通配选择器，标签选择器，类选择器，ID选择器是最基本，最常用的，也已经能够满足大部分代码的需求。

一，通配选择器

*{设置样式}

<style>
    *{color:#e8dd10;  /*通配选择器，将所有文本内容设置为黄色*/}
</style>

<p>文本1</p>
<p>文本2</p>
<p>文本3</p>
<div>文本4</div>

，标签选择器

        通过元素标签(比如p,div,title)来给一整类元素的所有内容进行样式设置。

        下图代码所示，通配选择器先将所有文字样式设置为黄色，随后标签选择器将所有<p>元素内的文字设置为红色，而剩余的一个<div>元素则也就是通配选择器设置的黄色。格式与上面的大同小异 ：标签{样式内容}

<style>
        *{color:#e8dd10;  /*通配选择器*/}
        p{
            color:#ff0000;  /*标签选择器*/
        }
</style>

<p>文本</p>
<p>文本</p>
<p>文本</p>
<div>文本</div>

三，类选择器

.类名{样式设置}

<style>
        *{color:#e8dd10;  /*通配选择器*/}
        p{
            color:#ff0000;  /*标签选择器*/
        }
        .nam{color:#00ff00;  /*类选择器*/}
</style>

<p>文本1</p>
<p  class = "nam">在元素中设置类名</p>    
<p>文本3</p>
<div>文本4</div>

四，ID选择器

        ID选择器的和类选择器比较类似，用户先设置一个标签的id，在针对此id进行样式设置。而id名不仅可以用来给选择器进行修饰，还可以应用到JavaScript中，即<script>标签。格式：#ID{样式设置}

<style>
        *{color:#e8dd10;  /*通配选择器*/}
        p{color:#ff0000;  /*标签选择器*/}
        .nam{color:#00ff00;  /*类选择器*/}
        #names{color:#0000ff;  /*ID选择器*/}
</style>

<p>标签选择器</p>
<p  class = "nam">类选择器</p>
<p  id = "names">ID选择器</p>
<div>通配选择器</p>