使用下面的标记,当悬停时,按钮文本带下划线。如何摆脱这种行为?
<a href="#"> <div class="btn-group"> <button class="btn">Text</button> <button class="btn">Text</button> </div> </a>
经测试的CSS行:
a:hover .btn-group { text-decoration: none } a .btn-group:hover { text-decoration: none } a:hover .btn-group .btn { text-decoration: none } a .btn-group .btn:hover { text-decoration: none }
任何额外的!重要不起作用,(由baptme提出)。
解决方法
{text-decoration:none!important}
编辑1:
对于你的例子,只有一个{text-decoration:none}将会起作用
您可以使用类不会干扰< a>的默认行为。标签。
<a href="#" class="nounderline"> <div class="btn-group"> <button class="btn">Text</button> <button class="btn">Text</button> </div> </a>
CSS:
.nounderline{text-decoration: none}