CSS怎样设置链接款式【html5教程】,CSS
作者:搜教程发布时间:2019-12-02分类:html教程浏览:34评论:0
导读:我们可以以差别的要领为链接设置款式。设置链接的款式(引荐进修:CSS入门教程)可以设置链接款式的CSS属性有很多种(比方color,font-fami...

我们可以以差别的要领为链接设置款式。
设置链接的款式 ( 引荐进修:CSS入门教程 )
可以设置链接款式的 CSS 属性有很多种(比方 color, font-family, background 等等)。
链接的特殊性在于可以依据它们所处的状况来设置它们的款式。
链接的四种状况:
a:link - 一般的、未被接见的链接
a:visited - 用户已接见的链接
a:hover - 鼠标指针位于链接的上方
a:active - 链接被点击的时候
实例
<!DOCTYPE html> <html> <head> <style> a:link {color:#FF0000;} /* 未被接见的链接 */ a:visited {color:#00FF00;} /* 已被接见的链接 */ a:hover {color:#FF00FF;} /* 鼠标指针移动到链接上 */ a:active {color:#0000FF;} /* 正在被点击的链接 */ </style> </head> <body> <p><b><a href="/index.html" 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>
当为链接的差别状况设置款式时,请根据以下序次划定规矩:
a:hover 必需位于 a:link 和 a:visited 以后
a:active 必需位于 a:hover 以后
以上就是CSS怎样设置链接款式的细致内容,更多请关注ki4网别的相干文章!
标签:CSS
相关推荐
- 纯 CSS 如何实现实现鼠标跟随效果?(代码详解)_html5教程,CSS,鼠标跟随
- 纯 CSS 如何实现实现鼠标跟随效果?(代码详解)_css教程,CSS,鼠标跟随
- CSS 实现拖拽改变布局大小_html5教程,CSS,左右拖拽,布局大小
- CSS 实现拖拽改变布局大小_css教程,CSS,左右拖拽,布局大小
- CSS Modules 详解_html5教程,CSS
- CSS Modules 详解_css教程,CSS
- 使用 CSS 实现一个简单的骨架屏(Skeleton Screen)_html5教程,CSS
- 使用CSS实现皮卡丘_html5教程,CSS
- CSS 中伪类的使用(干货)_html5教程,CSS
- 使用 CSS 实现一个简单的骨架屏(Skeleton Screen)_css教程,CSS
你 发表评论:
欢迎- html教程排行
-
- 1css如何实现给div添加滚动并隐藏滚动条_html5教程,css,div,滚动条
- 2css中的content属性该如何使用_html5教程,css,content
- 3伪元素“::after”和“::before”的作用分别是什么_html5教程,伪元素,::after,::before
- 4详解CSS3实现弹性布局的方式_html5教程,CSS3,弹性布局,flexbox
- 5如何使用CSS隐藏滚动条?_html5教程,隐藏,css,滚动条
- 6CSS开发常用命名_html5教程,css
- 7纯CSS3打造自行车_html5教程,CSS3
- 8css实现文字过长显示省略号_html5教程,css,省略号
- 9css如何实现下划线滑动效果_html5教程,css,下划线
- 最新文章
- 广而告之