购物车
登陆 / 注册
微信扫码登陆

推荐手册

CSS 链接(link)

CSS 链接(link)
不同的链接可以有不同的样式,链接的样式的设置可以用任何CSS中的属性比如颜色,字体,背景等;特别的链接,可以有不同的样式,这取决于他们是什么状态。本章节将介绍有关CSS 链接(link)的相关知识。
编辑:前端控 前端控 更新时间:2019-03-22 15:57:39

CSS 链接(link)

不同的链接可以有不同的样式

链接样式

链接的样式的设置可以用任何CSS中的属性比如颜色,字体,背景等

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

这四个链接状态是:

  • a:link:正常,未访问过的链接

  • a:visited:用户已访问过的链接

  • a:hover:当用户鼠标放在链接上时

  • a:active: 链接被点击的那一刻

注意:当设置为若干链路状态的样式,要遵循一定的顺序规则:

a:hover 必须跟在 a:link 和 a:visited后面

a:active 必须跟在 a:hover后面

常见的链接颜色

文本修饰

text-decoration 属性大多用于去掉链接中的下划线

实例

a:link {text-decoration:none;}
a:visited {text-decoration:none;}
a:hover {text-decoration:underline;}
a:active {text-decoration:underline;}

运行实例 »

点击 "运行实例" 按钮查看在线实例

效果图:

GIF.gif

背景颜色

背景颜色属性指定链接背景色

实例

a:link {background-color:#F64F4F;}
a:visited {background-color:#d9a9e5;}
a:hover {background-color:#9777F1;}
a:active {background-color:#6DEFF9;}

运行实例 »

点击 "运行实例" 按钮查看在线实例

效果图:

GIF.gif

网站导航
网站首页
学习路径
视频教程
开发软件
旗下子站
php中文网
phpstudy
技术文章
文档工具
关于我们
企业合作
人才招聘
联系我们
讲师招募
QQ交流群
QQ交流群
微信公众号
微信公众号