• 第四章css初识


    1.CSS(层叠样式表)

    2.CSS语法

        选择器{

            属性名1:属性值1;

            属性名2:属性值2;

         }

    3.引用CSS的三种方式

        第一种:行内样式

            例:<a style="color:red;">内部样式</a>

        第二种:内部样式

            在head标签中,写入style标签.

            例:

              <head>

                  .......

                  <style type="text/css">

                      h1{

                        .........

                      }

                  </style>

              </head>

        第三种:外部样式

            使用步骤:

                a)创建一个以.css为后缀的文件(css文件)

                b)在html中通过link引入css文件

                    <link rel="stylesheet" href="css文件路径"/>

    4.基本选择器

        4.1 标签选择器

            标签名{}

        4.2 类选择器

            .class属性值{}

        4.3 id选择器

            #id属性值{}

    5.层次选择器

        5.1 后代选择器

            父元素 子元素{}

        5.2 子选择器

            父元素>子元素{}

        5.3 相邻兄弟选择器

            本元素+相邻兄弟元素{} 

        5.4 通用兄弟选择器

           本元素~兄弟元素{}

    6.结构伪类选择器

        E F:first-child{}    //第一个子元素

        E F:last-child{}    //最后一个子元素

        E F:nth-child(?){}   // ?表示第几个子元素,还可以使odd奇数,even偶数

        E F:first-of-type{}  //指定类型的第一个元素

        E F:last-of-type{}  //指定类型的最后一个元素

        E F:nth-of-type(?){}   //?表示指定类型第几个子元素

    注意: 

        E F:nth-child(n)在父级里从一个元素开始查找,不分类型.

        E F:nth-of-type(n)在父级里先看类型,再看位置.

    7. 属性选择器

        E[attr] //具有属性attr的元素

        E[attr=val] //属性attr的值是val的元素

        E[attr^=val] //属性attr的值以val开头的元素

        E[attr$=val] //属性attr的值以val结尾的元素

        E[attr*=val] //属性attr的值包含val的元素

  • 相关阅读:
    call()与apply()的作用与区别
    Tomcat8/9的catalina.out中文乱码问题解决
    怎样查看Jenkins的版本
    每日日报2020.8.18
    528. Random Pick with Weight
    875. Koko Eating Bananas
    721. Accounts Merge
    515. Find Largest Value in Each Tree Row
    286. Walls and Gates (Solution 1)
    408. Valid Word Abbreviation
  • 原文地址:https://www.cnblogs.com/q2q2/p/7791834.html
Copyright © 2020-2023  润新知