CSS语法来控制超链接的形式、颜色变化

最新推荐文章于 2021-08-03 21:16:58 发布

xigl0727

最新推荐文章于 2021-08-03 21:16:58 发布

阅读量1.2k

点赞数

分类专栏： div+css 程序积累文章标签： css

程序积累同时被 2 个专栏收录

28 篇文章 0 订阅

订阅专栏

div+css

13 篇文章 0 订阅

订阅专栏

我们可以用 CSS语法来控制超链接的形式、颜色变化。

　　下面我们做一个这样的链接：未被点击时超链接文字无下划线，显示为蓝色；当鼠标在链接上时有下划线，链接文字显示为红色；当点击链接后，链接无下划线，显示为绿色。

　　实现方法很简单，在源代码的<head>和<head>之间加上如下的CSS语法控制：

　　其中：
　　a:link 指正常的未被访问过的链接；
　　a:active 指正在点的链接；
　　a:hover 指鼠标在链接上；
　　a:visited 指已经访问过的链接；
　　text-decoration是文字修饰效果的意思；
　　none参数表示超链接文字不显示下划线；
　　underline参数表示超链接的文字有下划线

　　下面这行文字就是我们刚才做的效果。

效果演示

　　同样，如果讲none替换成overline则给超链接文字加上划线，换成line-through给超链接文字加上删除线，blink则使文字在闪烁。

让网页中的链接去掉下划线

将代码插入在<head></head>之间.<title>之前即可
CSS实现链接的虚线/下划线效果

003CSS实现链接的虚线/下划线效果
a {
color:#3399FF;
font-weight:Normal; /*CSS字体效果普通可以改成bold粗体*/
text-decoration:none; /*CSS下划线效果：无下划线*/
}

a:hover {
color:#4499EE;
text-decoration:none; /*CSS下划线效果：无下划线*/
border-bottom: 1px #0099CC dotted /*CSS加一个只有下边的框边框为虚线*/
}

a{}控制连接的效果 a:hover{}控制鼠标移上去的效果。

xigl0727

关注

0
点赞
踩
3

收藏

觉得还不错? 一键收藏
0
评论
CSS语法来控制超链接的形式、颜色变化

我们可以用CSS语法来控制超链接的形式、颜色变化。　　下面我们做一个这样的链接：未被点击时超链接文字无下划线，显示为蓝色；当鼠标在链接上时有下划线，链接文字显示为红色；当点击链接后，链接无下划线，显示为绿色。　　实现方法很简单，在源代码的和之间加上如下的CSS语法控制：　　　　　　 a:link { text-decoration: none;color:
复制链接

扫一扫

专栏目录