Question

今天看到一个CSS代码，这都是什么意思？CSS还可以这样写？？XXX部分本来是代码，给我删除了……求大神！

.menu > li { //就是这里啊！！怎么还可以用“>”？

XXX
}
.menu > li:first-child { //……还能用冒号……
XXX
}
.menu a {
XXX
}
.menu a:hover {
XXX
}
.menu > li > a:before,
.menu > li > a:after { …………还能用逗号……
XXX
}
.menu > li > a:before {
XXX
}
.menu > li > a:after {
XXX
}

@font-face { //@也可以…………
XXX
}

Answer 1

.menu > li > 是子元素选择器，只有一代如：
<div class="menu"><li></li></div>正确
<div class="menu"><ul><li></li></ul></div>不正确
: 代表伪元素在元素之前添加内容
.menu > li :first-child 所有 menu 元素中的第一个 li 元素
.menu > li :before menu 子元素 li 之前添加内容
.menu > li :after menu 子元素 li 之后添加内容
中间的 ，表示两个样式一个并在一起写

.menu a:hover menu 下面所有超链接 鼠标悬浮的样式
一共四种状态：a:link ，a:visited ，a:hover，a:active

@是应用字体库

Answer 2

.menu > li { //就是这里啊！！怎么还可以用“>”？ > 是子元素选择器
:first-child 选择第一个元素
:before 之前
:after 之后
这些都是选择器的写法，很正常啊。 css3.0 也包括了选择器。

@是应用字体库的一种写法

Answer 3

这个.................. 你写少了， 多写些东西就知道了，以点看头就是类型，直接class = “类型名” 比如menu a:hover 就是指 menu 这个类下面的 超链接的 鼠标悬浮的样式，

Answer 4

去W3school学习一下css选择器就明白了~

Answer 5

次方法IE6部支持，方法>为子元素的意思，这些方法都是从JQ借鉴来的