HTML如何实现鼠标经过切换标签效果？HTML边框问题，请高手赐教，万分感谢！

Posted 2023-03-28

如何才能实现图上的效果？为什么选中“获取附加组件”时候，它右边的边框会消失呢？实现多标签切换需要用什么html标签<a>标签？还是无序列表？ 请高手详细解答

只需设置border-top, border-bottom, border-left三个边框样式,不指定border-right样式,就可以出现只有三边有边框的效果.
相连处无边框的效果可以通过层叠和浮动来实现,只要左侧内容向右"压"去一个边框的位置,就可将右侧的边框隐去.
用什么标签并不重要,都能实现.追问

还是不明白，其实我像这种效果 我想的是如果选中公司新闻，用JS代码去掉公司新闻项的下边框，但是下面那条边框不是还在吗？ 怎么解决？我很着急，万分感谢

追答

公司新闻是一个块元素,使它浮动,并且高度比行业新闻高出几像素,那么它的下边就可以将下面主体的上边遮去一些,这样看起来就可以是上图的效果了.
如果用图片做会更容易,标签与主体分隔的横线用作两个标签的父元素背景,那么,只要当前选中的标签高度超过横线高度,且背景不是透明的,就可将这一部分的线遮住.

参考技术A 给这个锚的hover伪类设置样式就是鼠标经过的样式了。