如何在实现在网页中，鼠标经过超连接时出现下划线效果
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了如何在实现在网页中，鼠标经过超连接时出现下划线效果相关的知识，希望对你有一定的参考价值。
<html><style>#a1
color: black; //在css里设置超链接为黑色
text-decoration: none; //在css里设置超链接不显示下划线
</style>
<body><a href="" id="a1" onmouseover="setText()" onmouseout="setText1()">《用户服务协议》</a>//body里添加超链接，并且为超链接添加事件
</body>
<script>function setText()
document.getElementById("a1").style.textDecoration="underline";
//鼠标移动到超链接时超链接显示下滑线
function setText1()
document.getElementById("a1").style.textDecoration="none";
//鼠标移动到超链接时超链接不显示下滑线
</script>
</html> 参考技术A a标签本身默认就有text-decoration:underline；属性。
超链接如何加下划线 css
我已经在CSS文件中定义超链接无划线，可现在又想让网页中的几个超链接有下划线，其它的没有！！
怎么做？代码？？能只改这几个吗？？让他不受原来的CSS控制
给需要添加下划线的超链接添加单独样式或者一个class，包含关键代码：text-decoration:underline。
实例演示如下：
1、设计一个HTMl页面，放入一些a标签超链接：
2、给a便签全部取消下划线:
3、此时的页面展示如下：
4、在样式中添加一个class，去掉下划线：
5、演示：给一些a便签添加第四步的class：
6、刷新页面，此时效果如下：
超链接加下划线的方法如下：
1、首先在新建的文档里面输入文字内容，示例代码如下：<a>文字内容，超链接的名字</a>。
2、进行预览，可以看到目前只有一个文字，没有任何的形式。
3、先进行设置超链接，代码如下：href="链接的网址"。
4、然后对网址文字进行下划线的设置，代码如下：class="noline"。
5、现在进行预览，就可以看到超链接有下划线了，整体代码如下：<a class="noline" href="http://ceshi.com">文字内容，超链接的名字</a>
CSS也可以实现设置一部分超链接有下划线，一部分没有下划线。
<style>
.box1 acolor:#000;text-decoration:none;
.box2 acolor:#000;text-decoration:underline;
<style>
<div class="box1"><a href="链接一">这里没有下划线的链接</a></div>
<div class="box2"><a href="链接一">这里有下划线的链接</a></div>
text-decoration 属性规定添加到文本的修饰。
语法：
text-decoration：<' text-decoration-line '> || <' text-decoration-style '> || <' text-decoration-color '>
默认值：看每个独立属性
适用于：所有元素
继承性：无
动画性：看每个独立属性
计算值：看每个独立属性
相关属性：<' text-decoration-skip '> || <' text-underline-position '>
取值：
<' text-decoration-line '>：
指定文本装饰的种类。相当于CSS2.1的 <' text-decoration '> 属性，可取值：none | underline | overline | line-through | blink
<' text-decoration-style '>：
指定文本装饰的样式。
<' text-decoration-color '>：
指定文本装饰的颜色。 参考技术C 你再另外起个名字，写上超链接的代码，然后在你网页中要用到的地方调用就行了。其它的都不用修改。
样式
.test a text-decoration:underline;
调用
<div class="test"><a href="#">网页中要有下划线的地方</a></div> 参考技术D
css部分：
.nolinetext-decoration: underline;
或者：
.nolinea:hover:text-decoration: underline;
html部分：
<a class="noline" href="http://ceshi.com">链接</a>
a标签的几种状态和顺序：
a:link
描述页面上的超级链接的文本的颜色、状态等
a:active
超级链接激活时，也就是当鼠标左键按下时，超级链接的文本的颜色、状态等
a:visited 已经看过的超级链接的文本的颜色、状态等
a:hover
当鼠标移动到超级链接上时，超级链接的文本的颜色、状态等
以上是关于如何在实现在网页中，鼠标经过超连接时出现下划线效果的主要内容，如果未能解决你的问题，请参考以下文章
div-map-area的html中，如何写CSS能让鼠标滑过area的超链接时出现效果？