CSS选择符——分门别类
CSS选择符——分门别类
有时候,老是会对一些CSS选择器模模糊糊,傻傻分不清。今天花了点时间整理了一下,感觉世界清静了不少。
用XMIND做出了思维导图:

主要有11中选择器:元素、类ID、后代、子选择器、同辈选择器、通用选择器、属性选择器、伪类、结构化伪类、伪元素、表单伪类。
总结
其实CSS选择器也没什么需要记住的,多用自然会熟悉。经常不用才会忘记。主要是CSS选择器的伪类和伪元素为CSS提供了更多操作性。比如::before和::after,可以添加元素,而不用多余写HTML标记。
CSS选择符——分门别类的更多相关文章
- 30个你必须记住的CSS选择符
所以你学会了基础的id,类和后代选择符,然后你就一直用它们了吗?如果是这样,你丢失了(css的)巨大的灵活性.在本文中提到的很多选择器属于CSS3规范的一部分,因此,只有在现代浏览器中才可使用. 1. ...
- CSS选择符详解
一.类型选择符 什么是类型选择符?指以网页中已有的标签类型作为名称的行径符.body是网页中的一个标签类型,div,p,span都是. 如下: body {} div {} p {} span {} ...
- 编写高效的CSS选择符(节选)
最右边优先 css选择符是从右向左进行匹配的. 样式系统从最右边的选择符开始向左匹配规则.只要当前的选择符的左边还有其他选择符,样式系统就会继续向左移动,直到找到和匹配的元素,或者因为不匹配而退出. ...
- JQuery学习笔记【CSS选择符】--02
Jquery的程序入口: <html> <head> <title></title> <script type="text/javasc ...
- CSS选择符详解之关系选择符篇
原文:http://www.chinaz.com/web/2012/1017/278553.shtml 相信大家都对CSS选择符都不陌生,选择符包含:元素选择符.关系选择符.属性选择符.伪类选择符.伪 ...
- 整理CSS选择符
1.星号选择器 ;; } 星号选择器将匹配页面里的每一个元素.很多开发者使用这个技巧将外边距和内边距重置为零.虽然在快速测试时这确实很好用,但我建议你永远不要再生产代码中使用它.它给浏览器带来大量不必 ...
- [css选择器]总结:IE6不支持的CSS选择符
转载地址:https://www.wenjiwu.com/doc/zvsbii.html.此文最后也给出了原文地址,但是我点击过去发现是什么赌博彩票的地址,360也弹出小心的提示,所以这里只给出了我转 ...
- css选择符权重
css选择符权重 目录 css选择符权重 css选择器权重列表 CSS选择符冲突处理 css选择符权重 css选择器权重列表 选择器 权重 内联样式 1000 ID 0100 CLASS 0010 属 ...
- CSS选择符、属性继承、优先级算法以及CSS3新增伪类、新特性
CSS 选择符有哪些?哪些属性可以继承?优先级算法如何计算? CSS3新增伪类有那些?CSS新增了哪些特性?下面我整理了一些,仅供参考. CSS 选择符: 1) id选择器(# myid) ...
随机推荐
- 使用es6一行搞定文字溢出省略号
使用的是es6中扩展字符串方法参考地址 padStart(),padEnd() 使用padStart() 两个参数padStart(字符串最小长度,用来补全的字符串): 例如 let str = '1 ...
- AngularJs开发——控制器间的通信
AngularJs开发——控制器间的通信 指令与控制器之间通信,无非是以下几种方法: 基于scope继承的方式 基于event传播的方式 service的方式 基于scope继承的方式 最简单的让控制 ...
- Java之戳中痛点 - (4)i++ 和 ++i 探究原理
先看一个例子: package com.test; public class AutoIncrement { public static void main(String[] args) { int ...
- xcode 10 出现 :-1: Multiple commands produce '/Users/.../Library/Developer/Xcode/DerivedData/.../Build/Products/Dev-iphonesimulator/TLYShyNavBar/TLYShyNavBar.framework/Info.plist': 1) Target 'TLYShyNavB
错误提示如下: :-1: Multiple commands produce '/Users/.../Library/Developer/Xcode/DerivedData/.../Build/Pro ...
- oracle查看字符集和修改字符集
oracle查看字符集和修改字符集 : 查看数据库服务器的字符集: select userenv('language') from dual ; 登陆用dba: 停掉数据库 : shutdown im ...
- 搭建jfinal+maven框架
1.创建一个maven web项目. 2.添加引用包 <dependency> <groupId>com.jfinal</grou ...
- 51nod 1040 最大公约数之和
给出一个n,求1-n这n个数,同n的最大公约数的和.比如:n = 6 1,2,3,4,5,6 同6的最大公约数分别为1,2,3,2,1,6,加在一起 = 15 Input 1个数N(N <= ...
- python 实现定时循环触发某个方法
直接贴上代码 import threading def sayhello(): print "hello world" global t #Notice: use global v ...
- Android USB Camera(1) : 调试记录【转】
转自:http://blog.csdn.net/eternity9255/article/details/53069037 版权声明:本文为博主原创文章,未经博主允许不得转载. 目录(?)[-] 前言 ...
- hammer.js触摸,手指缩放等许多手势操作
使用方法: 插件描述:Hammer.js是一个开源的,轻量级的javascript库,它可以在不需要依赖其他东西的情况下识别触摸,鼠标事件. <script src="http://e ...