• 元素选择符
  • 关系选择符
  • 属性选择符
  • 伪类选择符
  • 伪对象选择符

一、元素选择符

1.通配符:*{ }

2.类选择符:.类名称{ }

3.id选择符::#id名称{ }

4.类型选择符(标签选择符):标签 { }

二、关系选择符

1.子元素选择器:父亲>儿子

2.兄弟选择器::你自己~你的兄弟

3.相邻选择器:E+F

4.包含选择器:E F

三、属性选择符

1.属性

2.写法:

  (1)当前元素[属性]{ }

  (2)当前元素[属性="属性值"]{ }

四、伪类选择符

1.定义:它允许给htm标签的某种状态没置祥式。
    1)元素:link :设置超链接a在未被访问前的样式。
    2)元素:visited :设置超链接a在其链接地址已被访问过时的样式。
    3)元素:hover:设置元素在其鼠悬停时的样式。
    4)元索:active :没置元素在被用户激活(在鼠标点击与释放之间发生的事件)时的样式。
   
      2.注意! ! !
       1) a:hover必须位于a:link 和a:visited之后, a:active 必须位于a:hover之后。
       2)可靠的顺序是: I(link)ov(visited)e h(hover)a(active)te,即用喜欢(love)和讨厌(hate)连两个歌词来记忆。

五、伪对象选择符

1.元素:before{ }:设置在对象前发生的内容。用来和content属性一起使用,并且必须定义content属性.

2.元素:after{ }:设置在对象后发生的内容。用来和content属性一起使用,并且必须定义content属性。

选择器的优先级

!important>内联>ID>类>标签|伪类|属性选择器>伪对象>继承>通配符

注意:!important要写在属性值的后面,分号的前面。

例:

p{

  color:red !important;

}

CSS基础学习-2.CSS选择器(上)的更多相关文章

  1. CSS基础学习 21.CSS居中总结

    注意:*在IE中并不代表通配符的意思,是代表根元素的意思,所以为了匹配适应各种浏览器,进行页面初始化 <style> *{ margin:0; padding:0; } </styl ...

  2. CSS基础学习 20.CSS媒体查询

  3. CSS基础学习 19.CSS hack

  4. CSS基础学习 18.CSS多列

    四种常见的浏览器内核:

  5. CSS基础学习 17.CSS动画

  6. CSS基础学习 16.CSS过渡

  7. CSS基础学习-15-1.CSS 浏览器内核

  8. CSS基础学习-14 CSS visibility与overflow属性

  9. CSS基础学习-13.CSS 浮动

    如果前一个元素设置浮动属性,则之后的元素也会继承float属性,我觉得这里说是继承不太对,可以理解为会影响到之后的元素,所以在设置浮动元素之后的元素要想不被影响就需要清除浮动.元素设置左浮动,则清除左 ...

随机推荐

  1. vue router 报错: Uncaught (in promise) NavigationDuplicated {_name:""NavigationDuplicated"... 的解决方法

    参考资料:https://blog.csdn.net/zy21131437/article/details/99548983

  2. redis分布式映射算法

    redis分布式映射算法 一致性Hash算法的原理和实现 为了解决分布式系统中的负载均衡的问题 背景问题 有N台服务器提供缓存服务,需要对服务器进行负载均衡,将请求平均发到每台服务器上,每台服务器负载 ...

  3. MySQL连接处理方式及最佳并发连接数设置

    MySQL连接处理方式及最佳并发连接数设置 mysql是单进程,多线程的架构,通过创建多个线程来服务不同的用户连接,通常情况下,随着用户连接数的增加,mysql内部用于处理用户连接的线程也会同步的增长 ...

  4. 【重启C++】-- 序

    好久没看C++的东西了,该忘的也忘得差不多了,现在又要开始学,一点一滴的记录起来吧.

  5. 怎样理解HTMLCollection接口

    和 NodeList 类似, HTMLCollection 也是一个 类数组对象, 和NodeList不同的是, 它是各种 元素节点 的集合, 且不具有 forEach() 方法, 因此如果不转为真正 ...

  6. mpstat

    mpstat--multiprocessor statistics,统计多处理器的信息 1.安装mpstat工具 [root@localhost ~]# yum install sysstat 2:展 ...

  7. 11-Perl 运算符

    1.Perl 运算符运算符是一种告诉编译器执行特定的数学或逻辑操作的符号,如: 3+2=5.Perl 语言内置了丰富的运算符,我们来看下常用的几种: 算术运算符,比较运算符,逻辑运算符,赋值运算符,位 ...

  8. [js]$.ajax标准写法

    $.ajax({     url:"http://www.microsoft.com",    //请求的url地址     dataType:"json",  ...

  9. Linux下离线安装Docker最新版本

    一.基础环境1.操作系统:CentOS 7.32.Docker版本:18.06.1 官方下载地址(打不开可能需要梯子)3.百度云Docker 18.06.1地址:https://pan.baidu.c ...

  10. SQL With AS Expression

    A. Creating a simple common table expression The following example shows the total number of sales o ...