css3的属性选择器共有三种(css3的属性选择器共有三种类型)
CSS的选择器共有几类
三大类，分别为：id选择器，class选择器，标签选择器。
id选择器： #demoId{ }
class选择器: .demoClass{ }
标签选择器: p{ }
CSS3 选择器
css3中，追加了三个属性选择器分别为：
结构性伪类选择器由两部分构成，一是伪类选择器，一是伪元素选择器。
伪类选择器 ，要注意命名不要与系统定义好的选择器重名，例如link、hover
伪元素选择器 中包含 first-line、first-letter、before、after。
当root和body起冲突时，body就对内容区域生效，在内容区外则是root生效。
格式 :not(selector)
1. first-child 对一个父元素中的 第一个 子元素进行样式的指定
2. last-child 对一个父元素中的 最后一个 子元素进行样式的指定
3. nth-child（positon） 对一个父元素中的 指定序号 的子元素进行样式的指定
4. nth-last-child 对一个父元素中的 指定倒数序号 的子元素进行样式的指定
2）使用nth-of-type（odd）和nth-of-type（even）
1）使用nth-child
2）使用nth-child（an+b），a表示每次循环中，包括几种样式，b表示指定的样式在循环中所处的位置。
only-child选择器，在元素只有一个子元素时，可以代替使用 nth-child(1)/nth-last-child(1) 。
在css3选择器中，除了结构性伪类选择器外，还有一种UI元素状态选择器——只有当元素处于某种状态下才起作用，在默认状态下不起作用。
通过js改变输入框的可输入和不可输入状态，通过css样式改变输入框可输入和不可输入状态时的背景颜色。
用来位于同一个父元素之下的，给与一个子元素平级的另一个子元素设定样式
CSS的基本选择器有哪几种?分别适合在什么情况下使用?
三种：类别选择器、标签选择器、id选择器，类别是用class命名的时候用 标签是html标签的时候用 id就不用多说了
css3选择器有哪些类型,分别举例语法格式在html标签中使用的方法
1. 属性选择器
属性选择器(Attribute selector)让你可以基于属性来定位一个元素。你可以只指定该元素的某个属性，这样所有使用该属性——而不管它的值——的这个元素都将被定位，也可以更加明确并定位在这些属性上使用特定值的元素 —— 这就是属性选择器展示它们的威力的地方。
有6个不同类型的属性选择器：
[att=value]
该属性有指定的确切的值。
[att~=value]
该属性的值必须是一系列用空格隔开的多个值，(比如，class=”title featured home”)，而且这些值中的一个必须是指定的值”value”。
[att|=value]
属性的值就是“value”或者以“value”开始并立即跟上一个“-”字符，也就是“value-”。(比如lang=”zh-cn”)
[att^=value]
该属性的值以指定值开始。
[att$=value]
该属性的值包含指定的值(而无论其位置)。
[att*=value]
该属性的值以指定的值结束
比如，如果你想要改变你的博客上的日志部分元素的背景颜色，你可以使用一个指定每一个class属性值以“post-”开始的div的属性选择器：
div[class|="post"] { background-color: #333; }
代码laycode - v1.1
该语句将匹配所有class属性包含”post”并带”-”字符的div元素。(注：此处英文原文有些上下文不对应，我已经更正——译者，神飞)
属性选择器的另一个很有用的用处是定位不同类型的input元素。比如，如果你想让你的文本输入框使用一个特定的宽度，你可以使用下面的属性选择器：
input[type="text"] { width: 200px; }1
代码laycode - v1.1
这将匹配所有type属性值等于“text”的input元素。
现在我们可能像为网站上不同的文件类型的链接添加不同的图标，这样你的网站的访客就会知道他们将获得一个图片、或者PDF文件、或者是一个word文档等。这就可以使用属性选择器来实现：
a[href*=".jpg"] { background: url(jpeg.gif) no-repeat left 50%; padding: 2px 0 2px 20px; } a[href*=".pdf"] { background: url(pdf.gif) no-repeat left 50%; padding: 2px 0 2px 20px; } a[href*=".doc"] { background: url(word.gif) no-repeat left 50%; padding: 2px 0 2px 20px; }
代码laycode - v1.1
在此例中，我们使用了一个定位所有的链接(a)的href属性分别以.jpg,.pdf或.doc结束(*)的属性选择器。详细可查看前端观察之前的一篇文章《使用CSS选择器创建个性化链接样式》
浏览器支持
除了Internet Explorer 6，所有的主流浏览器都支持属性选择器。这意味着，如果你在你的网站上使用了属性选择器，你应该确保IE6用户将仍能获得一个可用的网站。比如我们的第三个例子，为链接添加图标可以给你的网站带来另一个级别的可用性，但是如果这些链接不显示任何图标，该网站仍然还是可用的。
2. 子选择器
子选择器用符号“”表示。它允许你定位某个元素的第一级子元素。
比如，如果你想匹配所有的作为你的网站侧栏的div的子元素的h2元素，而不是可能是在div元素内的所有h2元素，也不是div的孙元素(或者更低级别的)，你就可以使用下面的选择器：
div#sidebar h2 { font-size: 20px; }1
代码laycode - v1.1
你当然也可以同时使用子元素和后代元素。比如，如果你想定位只有在body元素的子级div元素内的blockquote元素(比如你想匹配主要的div内的blockquotes，而不是其它部分的：
body div div blockquote { margin-left: 30px; }
代码laycode - v1.1
浏览器支持
和属性选择器一样，子选择器不被IE6支持。如果你通过这种方式要实现的效果和网站的可用性或总体设计息息相关，你可以考虑使用一个class，或者使用只针对IE6的样式，但是这将有悖使用子选择器的目的。