css如何除去最后一个元素样式

跟大家讲解下有关css如何除去最后一个元素样式，相信小伙伴们对这个话题应该也很关注吧，现在就为小伙伴们说说css如何除去最后一个元素样式，小编也收集到了有关css如何除去最后一个元素样式的相关资料，希望大家看到了会喜欢。

css除去最后一个元素样式的方法：1、使用id或是类选择器将最后一个元素设置为默认样式即可；2、使用伪类“:last-child”，自动匹配最后一个元素，将其设置为默认样式即可，语法“元素名称:last-child{属性:默认值}”。

本教程操作环境：windows7系统、CSS3&&HTML5版、Dell G3电脑。

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

<style> .test li{ float:left; border-right:1px solid #ccc;　　 width:100px;　 　 height:100px;　　　　 } </stly> <ul class="test"> <li></li> <li></li> <li></li> </ul>

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

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

1、为最后个li添加个样式

.b-none{border:none}

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

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

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

推荐学习：css视频教程

以上就是css如何除去最后一个元素样式的详细内容，更多请关注php中文网其它相关文章！

来源：php中文网

　　免责声明：本文由用户上传，与本网站立场无关。财经信息仅供读者参考，并不构成投资建议。投资者据此操作，风险自担。 如有侵权请联系删除！