CSS基础元素，属性总结

CSS基础元素，属性总结复习

1.什么是CSS?

CSS-Cascading Style Sheet [层叠样式表]

是用于(增强)控制网页[html]样式并允许将样式信息与网页内容分离的一种标记性语言.

2.css选择器

1. 元素选择器---根据html元素的名称选中被控制的html标记。元素名称{  };
2. id选择器--根据给html标记设置的id属性来选中被控制的html标记  格式 #id名称{  }   // 例：#p1{font-size: 20px;color: orange;}
3. 类【class】选择器---根据给html标记设置的class属性来选中被控制的html标记。格式 .类名{ } 例：.p1{font-size: 20px;color: orange; background-color: aqua;}
4. 包含选择器--选择所有被父元素包含的子元素。格式：父元素名称   子元素名称 { }  例：div h1{ background-color: black;color: white;}
5.  属性选择器--根据html标记的属性来选中被控制的元素 

              格式：1.元素 [属性名称] { sRules }：选择具有某个属性的元素  例： p[id]{background-color: black;}

                          2.元素 [属性名称 = value【属性值】 ] { sRules }：选择具有某个属性且属性值等于 value 的元素

                                 例：h3[id="h1"][class="6"]{background-color: green;}

         属性选择器可以选择多个属性一起控制，多个属性需要用[ ]来隔开；

      6. 子元素选择器---选择所有作为E1子对象的 E2 。

           格式  父元素>子元素  例：div ol>li p{color: blue;}

       7.选择器分组----将同样的样式应用于多个选择器选中的元素上。不同的选择器之间使用“，”分割。

         格式： 选择器,选择器{  }   例：ul li[id="l1"], .olp{color: red;}

3.常用的伪类

       1.:link---设置 a 标记在未被访问前的样式。

             格式:a: link {css样式属性}

       2.:hover----设置对象在其鼠标悬停时的样式。

            格式:Selector: hover{css样式属性}