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

一、元素选择符

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. LCA cogs 2450 2048 1588

    t1 2450距离 链接:http://cogs.pro:8081/cogs/problem/problem.php?pid=vSNNNVqga [题目描述] 在一个村子里有N个房子,一些双向的路连接 ...

  2. 查看vue-cli3的webpack的配置信息

    参考链接:https://www.cnblogs.com/cag2050/p/10523096.html

  3. php学习历程1——注册、登录(面向过程、面向对象)

    首先放一张天空之城 Php入门来的第一个小项目,首先做的是一个简陋的文章管理系统.有登录.注册.文章list.添加文章.修改文章.删除文章.分页这几个小功能. 面向过程的编码 面向对象的编码 首先做的 ...

  4. drf框架的模块分析

    请求模块 请求模块是个什么鬼 ''' 1.drf的request是在wsgi的request基础上再次封装 2.wsgi的request作为drf的request一个属性:_request 3.新的r ...

  5. string库

    Lua字符串库小集 1. 基础字符串函数: 字符串库中有一些函数非常简单,如: 1). string.len(s) 返回字符串s的长度: 2). string.rep(s,n) 返回字符串s重复n次的 ...

  6. Scala学习三——数组相关操作

    一.若长度固定则使用Array,若长度可能有变化则使用ArrayBuffer 固定长度数组: 如val nums=new Array[Int](10) //10个整型数组,所有元素初始化为0; val ...

  7. Java开发自动售货机

    1:先写一个类,包括商品的基本属性 package com.xt.java.base25; public class Goods { private int ID; private String na ...

  8. vs2013nuget版本更新

    记录记录. NuGet 程序包还原失败: “Newtonsoft.Json 12.0.1”程序包需要 NuGet 客户端版本“2.12”或更高版本,但当前的 NuGet 版本为“2.7.40911.2 ...

  9. 题解 POJ1964/UVA1330/SP277 【City Game】

    题目链接: https://www.luogu.org/problemnew/show/UVA1330 http://poj.org/problem?id=1964 https://www.luogu ...

  10. 转:Git和Github简单教程

    转自:https://www.cnblogs.com/schaepher/p/5561193.html Git和Github简单教程   原文链接:Git和Github简单教程 网络上关于Git和Gi ...