li:first-child {color：red}

li:nth-child(3n) {color: red}

在对nth-child传参的时候，已经直接用公式，3n就表示3的倍数。多用伪类和伪元素，可以使代码更精简，多看一下。

display:table-cell实现垂直居中挺好用的，看别人的文章

另外，CSS3有个grid 布局，挺好用的，只是目前很多浏览器没有实现。

CSS的两个小知识点 伪类选择器和display:table-cell的更多相关文章

  1. 谈谈一些有趣的CSS题目（十）-- 结构性伪类选择器

    开本系列,谈谈一些有趣的 CSS 题目,题目类型天马行空,想到什么说什么,不仅为了拓宽一下解决问题的思路,更涉及一些容易忽视的 CSS 细节. 解题不考虑兼容性,题目天马行空,想到什么说什么,如果解题 ...

  2. CSS魔法堂：稍稍深入伪类选择器

    前言  过去零零星星地了解和使用:link.::after和content等伪类.伪元素选择器,最近看书时发现这方面有所欠缺,于是决定稍微深入学习一下,以下为伪类部分的整理. 伪类  伪类选择器实质上 ...

  3. CSS中伪类选择器及伪元素

    1.伪类选择器 在CSS中,最常用的伪类选择器是使用在a(锚)元素上的几种选择器,它们的使用方法如下: a:link{color:#FF0000;text-decoration:none} a:vis ...

  4. js进阶 10-8 伪类选择器有哪几类（自己不用，永远不是自己的）

    js进阶 10-8 伪类选择器有哪几类(自己不用,永远不是自己的) 一.总结 一句话总结:自己不用,永远不是自己的. 0.学而不用,却是为何? 自己不用,永远不是自己的,有需求的时候要想到它,然后操作 ...

  5. CSS3的一个伪类选择器:nth-child()

    CSS3的一个伪类选择器“:nth-child()”. Table表格奇偶数行定义样式: 语法: :nth-child(an+b) 为什么选择她,因为我认为,这个选择器是最多学问的一个了.很可惜,据我 ...

  6. python 全栈开发，Day47(行级块级标签,高级选择器,属性选择器,伪类选择器,伪元素选择器,css的继承性和层叠性,层叠性权重相同处理,盒模型,padding,border,margin)

    一.HTML中的行级标签和块级标签 块级标签 常见的块级标签:div,p,h1-h6,ul,li,dl,dt,dd 1.独占一行,不和其他元素待在同一行2.能设置宽高3.如果不设置宽高,默认为body ...

  7. 第49天学习打卡（CSS 层次选择器 结构伪类选择器 属性选择器 美化网页元素 盒子模型）

    推荐书籍:码出高效: Java 开发手册 2.2 层次选择器 idea里代码规范是按:ctrl +alt+L快捷键 注释快捷键:ctrl+/ 1.后代选择器:在某个元素的后面 祖爷爷 爷爷 爸爸 你 ...

  8. css伪类选择器及伪元素选择器

    1.类选择器 在css中可以使用类选择器把相同的元素定义成不同的样式.比如: 结果如下: 标题背景未变 2.伪类选择器 类选择器和伪类选择器的区别在于,类选择器我们定义的,而伪类选择器是CSS中已经定 ...

  9. CSS动态伪类选择器温故-3

    动态伪类选择器 伪类选择器:大家熟悉的:[:link][:visited][:hover][:active]CSS3的伪类选择器分为六种:(1)动态伪类选择器(2)目标伪类选择器(3)语言伪类选择器( ...

随机推荐

  1. 利用chrome的profiler查找js的memory leak

    1. 首先要固定一个测试环境.具体来说,选择某一个可以重复的操作,作为标准的测试动作. 2. 刷新浏览器后用profiler抓下heap snapshot. 3. 进行操作,再一次抓下snapshot ...

  2. java安装教程

    1.安装中,jdk和jre的安装在不同的目录中 2.环境变量的配置 选择系统变量中 新建以下3个环境变量: JAVA_HOME  jdk安装路径 CLASSPATH  .;%JAVA_HOME%\li ...

  3. jekyll安装的斗智斗勇

    jekyll---将纯文本转化为静态网站和博客,GitHub Pages 可以运行 Jekyll,你很简单就可以完全免费的在 GitHub 上发布网站. 小白安装jekyll时的若干问题,有错误欢迎指 ...

  4. 百度贴吧python吧抓取用户名和图片

    原理就是将贴吧条数中的用户提取出来并在此爬取用户中的图片 #!/usr/bin/env python #coding:utf-8 import requests import urllib2 impo ...

  5. fcc

    function spinalCase(str) { if(str.split(/\W|_/).length==1){ for(var i=0;i<str.length;i++){ if(/[A ...

  6. 黑马程序员_Java基础：反射机制（Reflection）总结

    ------- android培训.java培训.期待与您交流! ---------- 反射在java中有非常重大的意义,它是一种动态的相关机制,可以于运行时加载.探知.使用编译期间完全未知的clas ...

  7. 命令行解析Crash文件

    做了快两年的开发了,没有写过博客,最近公司app上架,程序崩溃被拒绝了,可是给的crash文件,又看不出哪里的问题,网上各种搜,终于找到了解决的办法,想想还是写个博客吧,希望给哪些也遇到这类问题的朋友 ...

  8. [java基础]java跨平台的基础知识

    1.Javac编译器 Javac编译器读取Java源代码,并将其编译成字节代码(.class格式),调用Javac的命令行示例如下: C:>javac options filename.java ...

  9. 【原创】--linux平台下opencv安装

    1.到opencv官网下载源码 也可以下载此链接http://pan.baidu.com/s/1mgId5ZM 2.解压到任意目录 可以使用右键-提取到此处,也可以在命令行中使用指令解压(linux中 ...

  10. HDU-4869 Turn the pokers

    原题:  Turn the pokers       思路:假设正面为0,反面为1.牌就像这样 000000....... .考虑到假如可以实现最终反面个数为m, 牌共n张, 则这n张排任取m个为反面 ...