发表新帖
发表新帖

underline tag when hovering

后端 未结
关注
6 1527
无人及你
无人及你 2021-02-07 20:58

I want my tag gets underlined when hovered. I have the following code, but it doesn\'t work.

<%@ Page Language=\"C#\" AutoEventWireup=\
相关标签:
6条回答
  • 我寻月下人不归
    2021-02-07 21:11

    when you use hover you cannot use inline styles. you have to write it like this:

    <!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
{
    text-decoration: none;
    color:red
}

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

</div>
</form>
</body>
</html>
    0 讨论(0)
  • 感动是毒
    2021-02-07 21:11

    This will work for you.

    <%@ 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>ABC</title>
    <style type="text/css">
       a.hover {text-decoration: none; color: red;}
       a.hover:hover {text-decoration: underline;}
    </style>
</head>
<body>
    <form id="form1" runat="server">
        <div>
             <a class="hover" href="">Site Map</a>
        </div>
    </form>
</body>
</html>

    Read more about css specification.

    0 讨论(0)
  • 孤街浪徒
    2021-02-07 21:14

    I think that you should write code like: (Demo here: http://jsfiddle.net/BH7YH/)

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

    </div>
    </form>
</body>
</html>
    0 讨论(0)
  • 无人共我
    2021-02-07 21:16

    The inline style overrides the style on the page.

    Remove the inline style and uses this:

    <style type="text/css">
    a {text-decoration: none;}
    a:hover {text-decoration: underline;}
</style>

    Also advise you not to use <style>, uses an external css file. Will greatly facilitate maintenance.

    0 讨论(0)
  • 悲&欢浪女
    2021-02-07 21:18

    The style attribute is more specific than any selector, so it will always be applied last in the cascade (horrible !important rules not withstanding). Move the CSS to the stylesheet.

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

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

    (I also suggest a more semantic name for the class).

    0 讨论(0)
  • 耶瑟儿～
    2021-02-07 21:29

    This might help!

    a.hover:link {text-decoration: none;}
a.hover:hover {text-decoration: underline;}
    0 讨论(0)
 看不清?
提交回复
热议问题