CSS选择符——分门别类

有时候,老是会对一些CSS选择器模模糊糊,傻傻分不清。今天花了点时间整理了一下,感觉世界清静了不少。

用XMIND做出了思维导图:

主要有11中选择器:元素、类ID、后代、子选择器、同辈选择器、通用选择器、属性选择器、伪类、结构化伪类、伪元素、表单伪类。

总结

其实CSS选择器也没什么需要记住的,多用自然会熟悉。经常不用才会忘记。主要是CSS选择器的伪类和伪元素为CSS提供了更多操作性。比如::before和::after,可以添加元素,而不用多余写HTML标记。

CSS选择符——分门别类的更多相关文章

  1. 30个你必须记住的CSS选择符

    所以你学会了基础的id,类和后代选择符,然后你就一直用它们了吗?如果是这样,你丢失了(css的)巨大的灵活性.在本文中提到的很多选择器属于CSS3规范的一部分,因此,只有在现代浏览器中才可使用. 1. ...

  2. CSS选择符详解

    一.类型选择符 什么是类型选择符?指以网页中已有的标签类型作为名称的行径符.body是网页中的一个标签类型,div,p,span都是. 如下: body {} div {} p {} span {} ...

  3. 编写高效的CSS选择符(节选)

    最右边优先 css选择符是从右向左进行匹配的. 样式系统从最右边的选择符开始向左匹配规则.只要当前的选择符的左边还有其他选择符,样式系统就会继续向左移动,直到找到和匹配的元素,或者因为不匹配而退出. ...

  4. JQuery学习笔记【CSS选择符】--02

    Jquery的程序入口: <html> <head> <title></title> <script type="text/javasc ...

  5. CSS选择符详解之关系选择符篇

    原文:http://www.chinaz.com/web/2012/1017/278553.shtml 相信大家都对CSS选择符都不陌生,选择符包含:元素选择符.关系选择符.属性选择符.伪类选择符.伪 ...

  6. 整理CSS选择符

    1.星号选择器 ;; } 星号选择器将匹配页面里的每一个元素.很多开发者使用这个技巧将外边距和内边距重置为零.虽然在快速测试时这确实很好用,但我建议你永远不要再生产代码中使用它.它给浏览器带来大量不必 ...

  7. [css选择器]总结:IE6不支持的CSS选择符

    转载地址:https://www.wenjiwu.com/doc/zvsbii.html.此文最后也给出了原文地址,但是我点击过去发现是什么赌博彩票的地址,360也弹出小心的提示,所以这里只给出了我转 ...

  8. css选择符权重

    css选择符权重 目录 css选择符权重 css选择器权重列表 CSS选择符冲突处理 css选择符权重 css选择器权重列表 选择器 权重 内联样式 1000 ID 0100 CLASS 0010 属 ...

  9. CSS选择符、属性继承、优先级算法以及CSS3新增伪类、新特性

    CSS 选择符有哪些?哪些属性可以继承?优先级算法如何计算? CSS3新增伪类有那些?CSS新增了哪些特性?下面我整理了一些,仅供参考. CSS 选择符: 1)      id选择器(# myid) ...

随机推荐

  1. 【BZOJ 1492】 [NOI2007]货币兑换Cash 斜率优化DP

    先说一下斜率优化:这是一种经典的dp优化,是OI中利用数形结合的思想解决问题的典范,通常用于优化dp,有时候其他的一些决策优化也会用到,看待他的角度一般有两种,但均将决策看为二维坐标系上的点,并转化为 ...

  2. Fabric证书解析

    一.证书目录解析   通过cryptogen生成所有证书文件后,以peerOrgannizations的第一个组织树org1为例,每个目录和对应文件的功能如下:   ca: 存放组织的根证书和对应的私 ...

  3. HDU3038:How Many Answers Are Wrong(带权并查集)

    How Many Answers Are Wrong Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Ja ...

  4. ext4文件系统由文件的inode号定位其inode Table

    在ubuntu中(以16.06为例),stat filename 可以查看文件的inode数值,但是如何确定该inode项具体在哪个块组下的inode Table中不是那么容易,接下来通过一步步计算来 ...

  5. Spring学习--使用 utility scheme 定义集合及 p命名空间

    util schema 定义集合: 使用基本的集合标签定义集合时 , 不能将集合作为独立的 Bean 定义 , 导致其他 Bean 无法引用该集合 , 所以无法在不同 Bean 之间共享集合. 可以用 ...

  6. [05] call by sharing || 共享参数

    转: https://segmentfault.com/a/1190000005177386 众所周知,JavaScript中参数是按值传递的.与访问变量不同,基本类型和引用类型的参数在传递时都如同变 ...

  7. netty学习指南

    这段时间领导让我熟悉Socket开发,我花了三周时间左右去学习相关的知识,包括Java socket开发,重点学习了netty这个异步非阻塞通信框架. 在这里把我学习过程中遇到的有用资料整理了,供大家 ...

  8. 关于flume的几道题

    1,要求:监听一个tcp,udp端口41414将数据打印在控制台 # example.conf: A single-node Flume configuration # Name the compon ...

  9. php中的split函数

    字符串分割函数:split函数 <?php $email='microsoft@exam!ple.com'; $domain = split('\.|@|!',$email);//split分割 ...

  10. [POJ2406&POJ1961]用KMP解决字符串的循环问题两例

    翻阅了一下网上资料,发现大部分都说这题是找规律...或是说YY出的一个算法..不会证明... 然后就脑补了一下证明 ~ 结论:对于一个字符串S[1..N],如果N mod (N-next[N])=0 ...