html - 悬停时在 <a> 标签下划线

标签 html css tags

我想要我的 <a>悬停时标记会带有下划线。我有以下代码,但它不起作用。

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <style type="text/css">

     a.hover:hover {text-decoration: underline;}
     </style>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <a class="hover" style=" text-decoration:none; color:red" href="">Site Map</a>

    </div>
    </form>
</body>
</html>

这个:

a:hover {text-decoration: underline;}
<a  style=" text-decoration:none; color:red" href="">Site Map</a>

也不行。

我该怎么办?有什么问题?

最佳答案

style属性比较specific比任何选择器都要多,所以它总是在级联中最后应用(可怕的 !important 规则无法忍受)。将 CSS 移动到样式表。

a.hover {
    color: red;
    text-decoration: none;
}

a.hover:hover {
    text-decoration: underline;
}

(我还为该类建议了一个更语义化的名称)。

关于html - 悬停时在 <a> 标签下划线,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16839284/

相关文章:

javascript - 对于特定情况,如何在单击按钮时隐藏 div

css - 两个 Fluid DIV 之间的固定 px 边距

javascript - 计算背景图像比

javascript - 使用 Javascript 函数在 html 中编辑表格的单元格

css - CSS中带引号和不带引号的属性选择器的区别

mercurial - cvs 到 Mercurial 的转换导致标签错误

javascript - 使用 jquery 解开视频标签

html - 背景图像在 chrome 中重复但在 safari 中不重复

css - 如何检查谷歌字体加载时间

html - 在 HTML5 视频标签中使用属性的正确方法是什么