网站建设中怎样给第n个元素加样式?

发表日期：2016-05-19 17:23 文章编辑：东郡网络浏览次数：182 标签：网站建设, 特定元素,

在网站建设中，为了达到各种不同的效果，这时需要给特定的元素加css样式，小编在这里为大家介绍两种方法以供大家选择。

一、用nth-child(n)给特定元素加样式
nth-child(n)适用于有很多循环选项中指定的某个元素，比如第八个就是nth-child(8)，下面来看看实例。
<div class="news">
<ul>
  <li>特定元素</li>
  <li>特定元素</li>
  <li>特定元素</li>
  <li>特定元素</li>
  <li>特定元素</li>
</ul>
</div>
要给第五个加样式就是这样的：
<style type="text/css">
    .news ul li nth-child(5){
  color:#000;
}
</style>
当然，这种方法也有不足，就是不兼容ie浏览器。

二、在每个循环标签上加序号
当我们需要给某个元素加样式时，可以把每个循环标签加上序号，这样就可以给单独某一个样式加入样式了，举一个帝国系统案例如下：
<div class="contect">
[e:loop={2,4,0,0}]
<p class="p<?=$bqno?>"></p>
[/e:loop]
</div>
其中，<?=$bqno?>标签就是数字序号，当每个标签都有序号时，单独给某个元素写样式就简单多了。

当然，在给第n个元素加样式时，还能用js 写法，有兴趣的同学可以自己尝试一下。网站建设不管怎样做，只要达到要求就行，有些写法浏览器不兼容，就需要我们换种方法了。

如没特殊注明，文章均为东郡网络原创,转载请注明来自：http://www.dongsem.com/xinwen/gongsixinwen/2016/0519/264.html