html如何去掉超链接下划线？html超链接去掉下划线的方法介绍

在html代码中去掉超链接的下划线需要的是css中的text-decoration这个属性。

对于text-decoration属性，我们需要定义的参数是 text-decoration:none; 就可以去掉超链接的下划线。（关于text-decoration属性中其他参数大家可以参考css学习手册）.

下面我们就直接来看html中a超链接去掉下划线的代码。

    !DOCTYPE html>
         html>
         head>
         meta charset="utf-8">
         style type="text/css">
      a{
text-decoration:none}
        /style>
         /head>
         body>
    欢迎来到a href="http://www.php.cn/">
    /a>
    ！    /body>
         /html>
    

html中a超链接去掉下划线的效果如下：

上面的代码所实现的是将html中a超链接下划线直接去掉，可是我们有时候需要让超链接去掉下划线，但鼠标停留在上面时有下划线，这该如何实现呢？下面我们就来直接看一下代码。

!DOCTYPE html>
     html>
     head>
     meta charset="utf-8">
     style type="text/css">
a:link,a:visITed{
     text-decoration:none;
  /*超链接无下划线*/}
a:hover{
     text-decoration:underline;
  /*鼠标放上去有下划线*/}
    /style>
    /head>
     body>
    欢迎来到a href="http://www.php.cn/">
    /a>
    ！/body>
     /html>
    

说明：上述代码中让超链接去掉下划线，但鼠标停留在上面时有下划线用到了:hover，在样式表里属于伪类，表示鼠标悬停时候的状态。

以上就是本篇文章的全部内容了，更多精彩大家可以关注！！！

以上就是html如何去掉超链接下划线？html超链接去掉下划线的方法介绍的详细内容，更多请关注其它相关文章！

声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！