微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

css应该怎么设置超链接样式

css设置超链接样式的方法是,给超链接添加伪类,例如【a:visited {color:#00FF00;}】。【a:visited】表示用户已经访问过的链接

本文操作环境:windows10系统、css 3、thinkpad t480电脑。

如果我们要设置超链接的样式,其实是可以使用任何一个css属性的,比如颜色、字体、背景等等。但是如果你想设置特别的样式,就需要使用到伪类。下面我们一起来看下伪类。

提示:特别的链接,可以有不同的样式,这取决于他们是什么状态。

这四个链接状态是:

代码示例:

<!DOCTYPE html>
<html>
<head>
<Meta charset=utf-8> 
<title>编程之家网(PHP.cn)</title> 
<style>
a:link {color:#000000;}      /* 未访问链接*/
a:visited {color:#00FF00;}  /* 已访问链接 */
a:hover {color:#FF00FF;}  /* 鼠标移动到链接上 */
a:active {color:#0000FF;}  /* 鼠标点击时 */
</style>
</head>
<body>
<p><b><a href=/css/ target=_blank>这是一个链接</a></b></p>
<p><b>注意:</b> a:hover 必须在 a:link 和 a:visited 之后,需要严格按顺序才能看到效果。</p>
<p><b>注意:</b> a:active 必须在 a:hover 之后。</p>
</body>
</html>

我们来看下运行效果

07d185231d0a182725ac6c5888a4fcb.png

相关推荐:css视频教程

原文地址:https://www.jb51.cc/css/1205703.html

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。