zoukankan      html  css  js  c++  java
  • 前端之CSS语法及选择器

    一、css语法:

    css由两大部分组成:选择符和声明,声明由属性和属性值两部分组成;

                     选择符{属性:属性值;属性:属性值;}

    注: a) 属性和属性值之间用冒号连接;

        b)每条声明结束要加分号;

    二、css选择器:

    1.id选择器:

    语法: <标记 id="id名"></标记>

           #id名{属性:属性值;}

    注:id名是唯一的,不允许出现同名的idid名不允许使用词列表的方式!

    2.class选择器:

    语法:<标记 class="class名"></标记>

          .class名{属性:属性值;}

    注:可以有相同的类名 也可以使用类名词列表的方式(当所有样式都与其他元素相同,只有某一个css样式与其他元素不同)

    3.元素选择符(类型选择符,标签选择器)

    语法:标记名称{属性:属性值;}

    注:a)如果想改变某个元素的默认样式时,可以使用类型选择符;

        b) 当统一文档某个元素的显示效果时,可以使用类型选择符;

    4.群组选择器:

    语法:选择符1,选择符2,选择符3{属性:属性值;}

    注:给多个元素设置同一个样式时,使用群组选择器

    5.后代选择器(包含选择器):

    语法:选择符1 选择符2 选择符3{属性:属性值;}

    注:选择符1,选择符2及选择符3一定是包含与被包含的关系

    6.通配符(通用选择器):

    语法: *{属性:属性值;}

    常用写法: *{margin:0; padding:0;}

    注:*匹配html下所有的标签元素

    7.伪类选择器:

    语法: 选择符:hover{属性:属性值;}

    超链接的四种状态:

    a:link     链接没有被访问过时的状态

    a:visited  链接访问过后的状态

    a:hover    鼠标滑过时的状态

    a:active   鼠标按下时的状态

    三、css权重问题

    1.第一等  内联样式  style=""  权重:1000

    2.第二等  id选择器            权重:100

    3.第三等  class选择器,伪类选择器,属性选择器   权重:10

    4.第四等  类型选择器,伪元素选择器      权重:1

    注:后代选择器  权重:各个选择器权重之和

        群组选择器  权重:各个选择器自身的权重

  • 相关阅读:
    Python循环语句
    Python基本数据类型
    Python条件句句
    Python基础
    jmeter用户自定义变量和CSV可变参数压测、和多参数的使用
    App资源在线升级更新
    javaweb项目启动报错org.apache.catalina.LifecycleException: Failed to start component [StandardEngine[Catalina].StandardHost[localhost].StandardContext[/cab-web]]
    mui移动端日期选择器的使用
    java把json字符串转成实体
    MUI集成个推实现消息推送
  • 原文地址:https://www.cnblogs.com/21-forever/p/10846338.html
Copyright © 2011-2022 走看看