巧用css去除第一个元素或最后个元素的样式

很多人可能都碰到这样一个情况:

<style>
    .test li{
      
       float:left;
       border-right:1px solid #ccc;
      width:100px;
      height:100px;    
}


这样就会出现三条右边框,在实际运用中最后条边框是需要去掉的。

这里为大家介绍两种方法:

  1、为最后个li添加个样式,比如

.b-none{
     border:none}

  2、用css伪类:last-child,来自动匹配最后个元素,并执行相应的样式.

.test li:last-child{
     border:none}

第二种伪类方法在IE下有兼容问题,如果不考虑兼容问题的话,到是个好选择。

转载于:https://www.cnblogs.com/Qzhou/archive/2013/04/22/3035644.html

你可能感兴趣的:(巧用css去除第一个元素或最后个元素的样式)