css四种引入方式

1 行内式

hello

2 嵌入式

3 链接式（推荐使用）

4 导入式(不推荐使用，是css语法格式，读取完html后才能加载进行渲染等诸多不便)

css的选择器

基础选择器：

*　　　　　　#通用选择器，匹配任何元素

P　　　　　　#标签选择器，匹配所有P标签元素

.author　　  #class选择器，匹配class=author的元素

#author　　  #id选择器，匹配所有id属性值等于author的元素

组合选择器

选择器后面不只是跟一个p 还可以跟更多p h 等标签也可以是class ， id等

div,p　　　　　　#多元选择器，匹配所有p和div元素，逗号分割

div p　　　　　　#后代选择器，匹配div下的p元素，不管是儿子孙子，只要在div下有p就匹配成功，使用空格分割

div > p　　　　  #子元素选择器，匹配div下的p元素，只管儿子不管孙子，只匹配div下面的p，使用>号分割

div + p　　　　　#相邻元素选择器，只选择div下面的第一个p标签，div上面的p标签不会选择成功

    
唐家三少：
            
斗罗大陆
        

            
斗破苍穹
        
    

    
天下第二：


    
黑道狂徒

多元选择器

后代选择器

子元素选择器

相邻元素选择器

 属性选择器

E[att]          #匹配所有具有att属性的E元素，不考虑它的值。（注意：E在此处可以省略，比如“[cheacked]”。以下同。）   p[title] { color:#f00; }

E[att=val]      #匹配所有att属性等于“val”的E元素                                 　　　　　　　　　　　　　　 div[class=”error”] { color:#f00; }

E[att~=val]     #匹配所有att属性具有多个空格分隔的值、其中一个值等于“val”的E元素      　　　　　　　　　　　　     td[class~=”name”] { color:#f00; }

E[attr^=val]    #匹配属性值以指定值开头的每个元素                     　　　　　　　　　　　　　　　　　　　　　　 div[class^="test"]{background:#ffff00;}

E[attr$=val]    #匹配属性值以指定值结尾的每个元素                     　　　　　　　　　　　　　　　　　　　　　　 div[class$="test"]{background:#ffff00;}

E[attr*=val]    #匹配属性值中包含指定值的每个元素                     　　　　　　　　　　　　　　　　　　　　　　 div[class*="test"]{background:#ffff00;}

 伪类(Pseudo-classes)

CSS伪类是用来给选择器添加一些特殊效果。

anchor伪类：专用于控制链接的显示效果

a:link（没有接触过的链接）,用于定义了链接的常规状态。

a:hover（鼠标放在链接上的状态）,用于产生视觉效果。

a:visited（访问过的链接）,用于阅读文章，能清楚的判断已经访问过的链接。

a:active（在链接上按下鼠标时的状态）,用于表现鼠标按下时的链接状态。

伪类选择器 : 伪类指的是标签的不同状态:

         a ==> 点过状态 没有点过的状态 鼠标悬浮状态 激活状态

a:link {color: #FF0000} /* 未访问的链接 */

a:visited {color: #00FF00} /* 已访问的链接 */

a:hover {color: #FF00FF} /* 鼠标移动到链接上 */

a:active {color: #0000FF} /* 选定的链接 */ 格式: 标签:伪类名称{ css代码; }

    a:link{
        color: red;
    }
    a:visited {
        color: blue;
    }
    a:hover {
        color: green;
    }
    a:active {
        color: yellow;

before after伪类 ：

a:after{content=”hello“}　　#用于在a标签后面添加内容

a:before{content=”hello“}　 #在a标签前面添加内容