实现除悬停元素之外的元素的部分不透明度
本次调查的目的是探索选择性降低元素不透明度的可能性，专门列出项目 (li)，同时排除当前悬停的项目。此效果模拟突出显示悬停元素的视觉提示。
使用 CSS 解决方案
为了实现此行为，我们利用级联样式表 (CSS)规则：
ul:hover li { opacity: 0.5; }
ul li:hover { opacity: 1; }解释
实现
<ul> <li>Item 1</li> <li>Item 2</li> <li>Item 3</li> </ul>
li {
float: left;
width: 33.33%;
line-height: 50px;
background: grey;
list-style-type: none;
}
ul:hover li {
opacity: 0.5;
}
ul li:hover {
opacity: 1;
}此演示说明了所需的效果，其中除当父列表元素悬停时，当前悬停的元素会显示为半透明。悬停的项目保持完全不透明，突出其存在。
以上是如何使列表项除悬停的项之外的项半透明？的详细内容。更多信息请关注PHP中文网其他相关文章！
