推荐::::方法一,使用:first-child 纯css的:first-child伪类就可以胜任此任务,操作很方便,代码量忽略不计。支持IE7+,不支持IE6
:first-child /:last-child伪类向元素的 第一个 / 最后一个 子元素添加样式。 延伸:li:nth-child(2) 第一个元素 IE不支持 https://www.cnblogs.com/guozh/p/10161623.html
ul li{ width:98px; height:146px; padding:5px; float:left; border-left:1px solid #ccc;}
ul li:first-child { border-left:0px solid #ccc;}
方法二:引入了jQuery库,再加一句简单的js代码即可
<script type="text/javascript" src="jquery-1.3.2.min.js"></script> //引入jQuery库
<script type="text/javascript">
$(function(){
$("#test li:last").css("border","none"); //关键函数,注意容器id“#test”要和html代码中一样
})
</script>
<ul id="test">
<li>菜单一</li>
<li>菜单二</li>
<li>菜单三</li>
</ul>
方法三:不用引入jQuery库,使用原生js代码实现
<script type="text/javascript">
window.onload = function urlborder() {
var listr = document.getElementById("test").getElementsByTagName('li'); //注意容器id“test”要和html代码中一样
for (var i = 0; i < listr.length; i++) {
if (i == listr.length - 1) {
listr[i].style.borderWidth = "0";
}
}
}
</script>