CSS学习

1、css和html元素的整合的三种方式：

• 内部样式表 在当前页面中使用的样式
      
          <style>
                      #divId2{
                          background-color: #0f0;
                      }
            </style>
• 内联样式表 通过标签的style属性设置样式

        <div style="background-color: #f00;">你好！程序员</div>

• 外部样式表 有独立的css文件

        <link rel="stylesheet" href="css/1.css" type="text/css"/>

---

2、选择器

• id选择器

            要求:
                html元素必须有id属性且有值   <xxx id="id1"></xxx>
                css中通过"#"引入,后面加上id的值  #id1{...}

•         class选择器

            要求:
                html元素必须有class属性且有值 <xxx class="cls1"/>
                css中通过"."引入,后面加上class的值  .cls1{...}
        元素选择器
            直接用元素(标签)名即可   xxx{...}
        

•     派生的选择器

        属性选择器★
            要求:
                html元素必须有一个属性不论属性是什么且有值  <xxx nihao="wohenhao"/>
                css中通过下面的方式使用
                    元素名[属性="属性值"]{....}
                    例如:
                        xxx[nihao="wohenhao"]{....}
        后代选择器
            选择器 后代选择器{...}   在满足第一个选择器的条件下找后代的选择器,给满足条件的元素添加样式了解的选择器

•         锚伪类选择器

            a:link {color: #FF0000}    /* 未访问的链接 */
            a:visited {color: #00FF00}    /* 已访问的链接 */
            a:hover {color: #FF00FF}    /* 鼠标移动到链接上 */
            a:active {color: #0000FF}    /* 选定的链接 */