css3怎么用伪类选择器不要第一个

html-css015

css3怎么用伪类选择器不要第一个,第1张

一、X:nth-child(n) li:nth-child(3) { color: red}接下来的几个伪类选择器使用上非常类似,功能也比较接近。 :nth-child(n),用于匹配索引值为n的子元素。索引值从1开始。 X:nth-child()用法实际上有三种变化,demo的用法是最简单的,X:nth-child()更强大的用处在于奇偶匹配,明河不展开讲,有兴趣的请看《Understanding :nth-child Pseudo-class Expressions》,《CSS3 :nth-child()伪类选择器》 二、X:nth-last-child(n) li:nth-last-child(2) { color: red}:nth-child(n),是从第一个开始算索引,而X:nth-last-child(n)是从最后一个开始算索引。

没有通用的办法。

CSS3选择器里面有 :not 伪类型选择器,比如设置页面除了<a>标签之外所有元素的color为红色:

*:not(a) { color : red }

问题出在你错用了<p>!!!

<p>的作用并不是仅仅换行,它是一个区块来的,即使你只用了<p>,最终浏览器也会自动按<p>...</p>来处理的!因此:

<input type="text" id="text1" name="text" class=""><div class="font">&nbsp&nbsp&nbsp&lt&lt&lt请输入第一位非零的六位订单号</div>

<p>

<label for="text2">客户电话:</label>

<input type="text" id="text2" name="text"><div class="font">&nbsp&nbsp&nbsp&lt&lt&lt请输入不能超过12个汉字的</div>

就相当于

<input type="text" id="text1" name="text" class=""><div class="font">&nbsp&nbsp&nbsp&lt&lt&lt请输入第一位非零的六位订单号</div>

<p>

<label for="text2">客户电话:</label>

<input type="text" id="text2" name="text"><div class="font">&nbsp&nbsp&nbsp&lt&lt&lt请输入不能超过12个汉字的</div>

</p>  浏览器会自动添加这个!

但是,有一点很特殊的是,<p>...</p>里面是不能包含<div>...</div>的!它会自动跳到<p>的外面,所以实际上就变成:

<input type="text" id="text1" name="text" class=""><div class="font">&nbsp&nbsp&nbsp&lt&lt&lt请输入第一位非零的六位订单号</div>

<p>

<label for="text2">客户电话:</label>

<input type="text" id="text2" name="text">

</p>

<div class="font">&nbsp&nbsp&nbsp&lt&lt&lt请输入不能超过12个汉字的</div>

这样的话,这个div里面的内容就会自动换行了,这跟它是否inline是无关的,因为换行是由<p>造成的

而第一个div因为没有被包含到<p>里面,所以它不受影响,不会换行。

解决的办法很简单,只要把所有<p>换成<br>就行了!!!

总结:不要乱用<p>,用的时候要成对来用,一定要把它当作类似<div>的区块来用,但要注意<div>里面可以包含<p>,但<p>里面不能包含<div>!如果是仅仅需要换行,就用<br>吧!