学习不止眼前的教程与笔记 还需实践与创新

搜索

首页>>网站建设>>css>>基础教程>>

CSS基础教程(七) 链接

发布时间:2020-01-03点击:

    在CSS中链接的样式其实包含很多,它可以使用前面所说的背景相关样式、文本样式以及字体样式。也可以说链接属于前面三种。但是链接又有着它自己的独特样式。

    一、CSS链接状态

    链接一共四种状态:

    1、正常状态:未访问过的链接,定义属性 a:link

    2、用户已访问过的链接:定义属性a:visited

    3、当用户鼠标放在链接上时:定义属性a:hover

    4、链接被点击的时候:定义属性a:active

    PS:a:hover 必须跟在 a:link 和 a:visited后面;a:active 必须跟在 a:hover后面。

    实例:

    a:link {color:#000000;}      /* 未访问链接*/
    a:visited {color:#00FF00;}  /* 已访问链接 */
    a:hover {color:#FF00FF;}  /* 鼠标移动到链接上 */
    a:active {color:#0000FF;}  /* 鼠标点击时 */

    二、CSS链接常用设置

    默认中的链接是有下划线的,我们可以使用字体的属性去掉:

    a:link {text-decoration:none;}

    但是上述链接仅限于正常状态时链接不显示下划线,被用户点击后或者点击时还是会出现下划线的,如果不想出现,需要设置链接的四种状态均为none。

    学习不止眼前的教程与笔记还需实践与创新——小伙伴们块动手试试吧~

赞一个(0)     踩一个(0)    

相关链接

搜索