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. [codeforces] 633C Spy Syndrome 2

    原题 Trie树+dp 首先,我们可以简单的想到一种dp方式,就是如果这一段可以匹配并且可以与前一段接上,那么更新dp[i]为当前字符串的编号,然后倒推就可以得到答案. 但是,显然我们不能O(m)比较 ...

  2. AOJ.800 热身之开关灯

    热身之开关灯 Time Limit: 1000 ms Case Time Limit: 1000 ms Memory Limit: 64 MB Total Submission: 276 Submis ...

  3. 解析Mybaits的insert方法返回数字-2147482646的原因

    前言:前几天在做项目demo的时候,发现有一个很奇怪的现象,就是MyBatis发现更新和插入返回值一直为"-2147482646".无论怎么改,这个值一直不变...是在摸不着头脑, ...

  4. 关于 WizTools.org RESTClient的使用

    今天分享一个很好用的测试service的工具,很好用 提供两种方法使用这个东东. 第一种方法 通过cmd命令窗口. (1)cd C:\Users\li_weifeng\Desktop\c4d2(文件存 ...

  5. HDU 多校对抗赛 A Maximum Multiple

    Maximum Multiple Time Limit: 4000/2000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others) ...

  6. 关于跨域策略文件crossdomain.xml文件--配置实例

    转载自:http://bbs.phpchina.com/blog-52440-191623.html 我一直不太明白crossdomain.xml文件是干嘛用的,今天总算比较清楚的知道了一下. 这是F ...

  7. [Python]简单的外星人入侵游戏

    alien_invasion.py: import sys import pygame from setting import Settings from ship import Ship impor ...

  8. 【LA3487】最小割-经典模型 两种方法

    题目链接 题意:A.B两个公司要买一些资源(他们自己买的资源不会重复),一个资源只能卖给一个公司.问最大收益. simple input 部分: 54 1 //买到1就给54元 15 2 33 3 2 ...

  9. MySQL 之 foreign key

    前段回顾 create table 表名( 字段名1 类型[(宽度) 约束条件], 字段名2 类型[(宽度) 约束条件], 字段名3 类型[(宽度) 约束条件] ); #解释: 类型:使用限制字段必须 ...

  10. 最近研究xcodebuild批量打包的一些心得

    http://blog.csdn.net/tlb203/article/details/8131707 转自Rainbird的个人博客 以前的时候只知道做安卓开发的兄弟挺辛苦的,不但开发的时候要适配一 ...