2016.12.30 加号选择器

fredaouyang

于 2016-12-30 20:47:30 发布

阅读量322

点赞数

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/fredaouyang/article/details/53946324

本文介绍了CSS中加号选择器的使用方法，并通过实例展示了如何利用加号选择器为导航栏中的列表项添加边框，仅除了第一个列表项。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

加号选择器：相领兄弟选择器，假如有a、b两元素，b元素紧跟在a元素的后面，且a、b元素拥有相同的父元素。如果想选择b元素，此时可以用加号选择器。

例如：为导航栏加入右边框，除第一个元素外：

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<style>
	li{
		list-style: none;
		float: left;
		margin-left: 10px;
	}
	li+li{
		border-left: 2px solid #000;
	}

	</style>
</head>
<body>
<ul class="tab">
	<li>我的财富</li>
	<li>我的主页</li>
	<li>登录</li>
	<li>注册</li>
	<li>加入</li>
</ul>	
</body>
</html>

因为选择了每个li元素的后面的一个元素，所以除第一个元素外其他的li元素都被选择了。