怎么用CSS选择ul里最后一个li里面的a元素

html-css022

怎么用CSS选择ul里最后一个li里面的a元素,第1张

<ul style="max-height: 230pxoverflow-y: auto" class="dropdown-menu inner selectpicker" role="menu">

<li class="" rel="0"><a tabindex="0" class="" style=""><span class="text">Please Choose</span></a></li>

<li class="" rel="1"><a tabindex="0" class="" style=""><span class="text">QQQQ</span></a></li>

<li class="" rel="2"><a tabindex="0" class="" style=""><span class="text">PPPP</span></a></li>

<li class="" rel="3"><a tabindex="0" class="" style=""><span class="text">abc</span></a></li>

<li class="" rel="4"><a tabindex="0" class="" style=""><span class="text">aaaaaaaa</span></a></li>

</ul>

选择最后一个元素

driver.findElement(By.xpath("(//ul[@class='dropdown-menu inner selectpicker']/li)[last()]/a/span[@class='text']")).click()

扩展资料:

注意事项

如果页面中有两个<ul><li>...</li></ul>,需要先定位到特定的ul,不然li[last()]会始终选择当前页面的最后一个li。

css之指定带有特点样式的ul下所有li里面的a标签的样式

<style type="text/css">

ul.aside-hd li a{

color:#B97800

}

.aside-hd li a:HOVER {

color:red

}

</style>

css之指定带有特点样式的ul下所有li里面的a标签的样式。

把里面的ul的宽度设为与父级的li同宽即可,最简单就是 width:100%

当然如果父级的li与祖父级的ul也不同宽,那么父级li也要设为 width:100%

还有一点,就是如果背景色(绿色)是设在最底层的li的,那么li的宽度也要设为 width:100%

方法一:用Jquery(需要先下载jquery-1.3.2.min.js,其它版本也可以哦)

用Jquery简单一些(一句话就OK,千万记住要引用Jquery哦,如果没有,去网上下一个,很方便的)

<html>

<title></title>

<head>

<script type="text/javascript" src="jquery-1.3.2.min.js"></script>

<script type="text/javascript">

$(function(){

$("#ul1 li:last").css("border","none")

})

</script>

<style type="text/css">

ul,li{ margin:0padding:0list-style:none}

#ul1{ width:200px}

#ul1 li{ width:100%height:24pxborder-bottom:1px solid red}

</style>

</head>

<body>

<ul id="ul1">

<li>菜单一</li>

<li>菜单二</li>

<li>菜单三</li>

</ul>

</body>

</html>

方法二:直接写JS脚本,代码稍微多一点点

<html>

<title></title>

<head>

<script type="text/javascript">

window.onload = function urlborder() {

var listr = document.getElementById("ul1").getElementsByTagName('li')

for (var i = 0i <listr.lengthi++) {

if (i == listr.length - 1) {

listr[i].style.borderWidth = "0"

}

}

}

</script>

<style type="text/css">

ul,li{ margin:0padding:0list-style:none}

#ul1{ width:200px}

#ul1 li{ width:100%height:24pxborder-bottom:1px solid red}

</style>

</head>

<body>

<ul id="ul1">

<li>菜单一</li>

<li>菜单二</li>

<li>菜单三</li>

</ul>

</body>

</html>

不知道能否满足要求,还不行的话可以Hi我