css基础

英文:Cacxading Style Sheets.(层叠样式表/级联样式表)
样式表: (1)外部样式表:head-link(新建.FIRE(HTML) .CSS)
             (2) 内联样式表:style
             (3) 内嵌样式表:head里面(属性:属性值)

选择器:
          (1)元素选择器em(color:blue;)
          (2)类选择器.类名(属性:值;)
          (3)ID选择器#ID名(属性:值;)
          (4)包含选择器<li><em></em></li>
          (5)通配符选择器*{color:blue;}

     权重:

              内嵌     ID    class    元素

     内嵌       1      0      0        0

     ID         0      1      0        0

     CLASS      0      0      1        0

     元素/伪元素 0       0      0        1

     通配符*    0  

     !important   最高(css元素选择器里面)
  连接
a:link{
    font-size: 30px;
    color: red;
}链接的样式
a:visited{
    color: grey;
}链接以后的样式
a:hover{
    background: greenyellow;
}鼠标移入的样式
a:active{
    font-size: 60px;
}鼠标点击时的效果
.test2:focus{
    border: 3px solid #990099;
}获取光标的时候
table :empty{
    background: lightgrey;
}空白表格
.div1:first-line{
    font-size: 25px;
}第一行
.div1:first-letter{
    color: red;
}第一个字
a:before{
    content: "请点击";
}之前加入字
a:after{
    content: "才怪嘞!";
}之后加入字   乱码时第一行添加@charsest"utf-8"
(通配符)*{
    /*margin: 0;*/
    /*padding: 0;*/
}(元素属性之间定义后会缩进)
 ul li:nth-child(2){
   background: moccasin;
}第几个改变
ul li:nth-child(3){
background: #ebccd1;
}
 ul li:nth-last-child(2){
     background: #df1f0d;
 }倒第二个改变
ul li:nth-child(odd){
    background: moccasin;
}奇数改变
ul li:nth-child(even){
    background: royalblue;
}偶数改变
ul li:nth-child(2n+1){
    background: greenyellow;
}每两个改变
table td(tr)里面就可以同理可得

原文地址:https://www.cnblogs.com/paul-du/p/5281791.html