-
“
:only-child”选择器选择的是父元素中只有一个子元素，而且只有唯一的一个子元素。也就是说，匹配的元素的父元素中仅有一个子元素，而且是一个唯一的子元素。查看全部 -
“
:nth-of-type(n)”选择器和“:nth-child(n)”选择器非常类似，不同的是它只计算父元素中指定的某种类型的子元素。当某个元素中的子元素不单单是同一种类型的子元素时，使用“:nth-of-type(n)”选择器来定位于父元素中某种类型的子元素是非常方便和有用的。在“:nth-of-type(n)”选择器中的“n”和“:nth-child(n)”选择器中的“n”参数也一样，可以是具体的整数，也可以是表达式，还可以是关键词。查看全部 -
“:first-of-type”选择器类似于“:first-child”选择器，不同之处就是指定了元素的类型,其主要用来定位一个父元素下的某个类型的第一个子元素。
查看全部 -
nth-last-child 是 nth-child 的倒序方案。
“:nth-last-child(n)”选择器和前面的“:nth-child(n)”选择器非常的相似，只是这里多了一个“last”，所起的作用和“:nth-child(n)”选择器有所区别，从某父元素的最后一个子元素开始计算，来选择特定的元素。
查看全部 -
“:nth-child(n)”选择器用来定位某个父元素的一个或多个特定的子元素。其中“n”是其参数，而且可以是整数值(1,2,3,4)，也可以是表达式(2n+1、-n+5)和关键词(odd、even)，但参数n的起始值始终是1，而不是0。也就是说，参数n的值为0时，选择器将选择不到任何匹配的元素。
经验与技巧:当“:nth-child(n)”选择器中的n为一个表达式时，其中n是从0开始计算，当表达式的值为0或小于0的时候，不选择任何匹配的元素。
查看全部 -
“:last-child”选择器与“:first-child”选择器作用类似，不同的是“:last-child”选择器选择的是元素的最后一个子元素。
查看全部 -
“:first-child”选择器表示的是选择父元素的第一个子元素的元素E。简单点理解就是选择元素中的第一个子元素，记住是子元素，而不是后代元素。
查看全部 -
:target选择器称为目标选择器，用来匹配文档(页面)的url的某个标志符的目标元素。我们先来上个例子，然后再做分析。示例展示
点击链接显示隐藏的段落。
不点击没有效果
查看全部 -
:empty选择器表示的就是空。用来选择没有任何内容的元素，这里没有内容指的是一点内容都没有，哪怕是一个空格。查看全部 -
:not 否定选择器
input:not[type="submit"] {
样式列表
}
<input type="text"></input>
<input type="submit"></input>
查看全部 -
:root 表示根标签，可设置背景
查看全部 -
<style>
a[class^="column"]{background:red;}
a[href$="doc"]{background:green;}
a[title*="box"]{background:blue;}
</style>
查看全部 -
/*使用伪元素制作导航列表项分隔线*/
.nav li:after{
right:0;
content: "";
position: absolute;
background:linear-gradient(to top,#f65f57,blue,#f65f57);
width:1px;
height:50%;
top:25%;
vertical-align:middle;
}
/*删除第一项和最后一项导航分隔线*/
.nav li:last-child:after{
background:none;
}
查看全部 -
background-size：auto | 长度值 | 百分比 | cover | contain
查看全部 -
background-clip：border-box | padding-box | content-box | no-clip
背景图片裁剪
查看全部
举报