美文网首页
CSS学习4

CSS学习4

作者: 风林山 | 来源:发表于2016-10-31 16:12 被阅读0次

链接

我们能够以不同的方法为链接设置样式。能够设置链接样式的 CSS 属性有很多种(例如 color, font-family, background 等等)。链接的特殊性在于能够根据它们所处的状态来设置它们的样式。

链接的四种状态:

  • a:link - 普通的、未被访问的链接
  • a:visited - 用户已访问的链接
  • a:hover - 鼠标指针位于链接的上方
  • a:active - 链接被点击的时刻

当为链接的不同状态设置样式时,请按照以下次序规则:

  • a:hover 必须位于 a:link 和 a:visited 之后
  • a:active 必须位于 a:hover 之后

实例:

a:link {color:#FF0000;} /* 未被访问的链接 /
a:visited {color:#00FF00;} /
已被访问的链接 /
a:hover {color:#FF00FF;} /
鼠标指针移动到链接上 /
a:active {color:#0000FF;} /
正在被点击的链接 */

常见的链接样式:

  • 文本修饰:text-decoration 属性大多用于去掉链接中的下划线:

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

  • 背景色:background-color 属性规定链接的背景色:

a:link {background-color:#B2FF99;}
a:visited {background-color:#FFFF85;}
a:hover {background-color:#FF704D;}
a:active {background-color:#FF704D;}

相关文章

  • 2018-09-19 css核心属性

    DAY4:CSS核心属性 学习目标 1、css浮动属性详解 2、css文本属性 3、css列表属性 4、css背景...

  • CSS学习(1)

    学习资源:1、学习CSS布局2、CSS 禅意花园3、CSS 开发者指南【MDN】4、HTML Dog5、CSS Z...

  • 前端学习路线V1.0

    第一阶段: HTML+CSS 学习周期:4周 学习路线:HTML语法、CSS语法->div+css布局->html...

  • 03-CSS核心属性

    学习目标 1、css浮动属性详解2、css文本属性3、css列表属性4、css背景属性5、css边框属性 一、cs...

  • CSS学习4

    链接 我们能够以不同的方法为链接设置样式。能够设置链接样式的 CSS 属性有很多种(例如 color, font-...

  • Day03_CSS属性组成和作用

    学习目标 1、css属性和属性值的定义2、css文本属性3、css列表属性4、css背景属性5、css边框属性6、...

  • 文章列表目录

    前端学习 H5+CSS H5+CSS 【1】H5+CSS 【2】H5+CSS 【3】H5+CSS 【4】 Java...

  • CSS基础入门(第四天)

    一、学习计划: 1.CSS的定义和HTML的关系 2.如何编写CSS 3.CSS语法和简单属性 4.CSS选择器 ...

  • Sass学习笔记4 - 总结篇

    CSS预处理器 —— Sass学习笔记4 注释 单行注释: // 不会被编译后的css文件中 多行注释:/...

  • CSS学习笔记(4)

    要用CSS画出各种形状,可以谷歌搜索"css trick shape"关键词。 iconfont.cn是国内的一个...

网友评论

      本文标题:CSS学习4

      本文链接:https://www.haomeiwen.com/subject/xxdputtx.html