• 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)里面就可以同理可得

  • 相关阅读:
    Python中文乱码(转)
    一千行MySQL学习笔记
    pycharm在同目录下import,pycharm会提示错误,但是可以运行
    PyCharm3.0默认快捷键
    Sublime Text 3 快捷键
    window下spyder的快捷键
    Anaconda更新和第三方包更新
    PyCharm 教程
    centos7.9 源码编译安装php
    centos7.9 源码编译安装nginx
  • 原文地址:https://www.cnblogs.com/paul-du/p/5281791.html
Copyright © 2020-2023  润新知