hltm连接css的link,CSS 链接(link)

CSS 链接

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

链接样式

链接的样式，可以用任何CSS属性(如颜色，字体，背景等)。

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

这四个链接状态是：

a:link - 正常，未访问过的链接

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

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

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

实例

a:link {color:#FF0000;} /* 未访问链接*/

a:visited {color:#00FF00;} /* 已访问链接 */

a:hover {color:#FF00FF;} /* 鼠标移动到链接上 */

a:active {color:#0000FF;} /* 鼠标点击时 */

尝试一下 »

当设置为不同的链接状态的样式，也有一些顺序规则：

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;}

尝试一下 »

背景颜色

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

实例

a:link {background-color:#B2FF99;}

a:visited {background-color:#FFFF85;}

a:hover {background-color:#FF704D;}

a:active {background-color:#FF704D;}

尝试一下 »

更多实例

添加不同样式的超链接

这个例子演示了如何为超链接添加其他样式。

高级 - 创建链接框

这个例子演示了一个更高级的例子，我们结合若干CSS属性显示为方框。

hltm连接css的link,CSS 链接(link)相关推荐

html链接css代码link,link标签链接css放在哪？
当样式需要被应用到很多页面的时候,外部样式表将是理想的选择.使用外部样式表,你就可以通过更改一个文件来改变整个站点的外观.在HTML页面中可以使用link标签链接外部样式表. 在HTML中使用link ...
CSS教程:vlink,alink,link和a:link
超链接文字的状态可以通过伪类选择符+样式规则来控制. 一组专门的预定义的类称为伪类,主要用来处理超链接的状态.超链接文字的状态可以通过伪类选择符+样式规则来控制.伪类选择符包括: 总: a 表示超链 ...
css第二课：外部样式link和import的运用及行内样式的介绍
一:外部样式 1.先讲用link引入外部样式: 首先我们新建一个css文件夹,放外部css样式文件,然后创建一个css文件(.css),如下图: 新建一个html文件写代码,代码,在css文件里写样式 ...
CSS的三种链接方式（内联式、嵌入式、外部式）
内联式CSS样式其实就是用html中style属性 <p style="color:blue">示例</p> 嵌入式CSS样式嵌入式css样式,就是可以 ...
【代码笔记】Web-CSS-CSS 链接(link)
一,效果图. 二,代码. <!DOCTYPE html> <html> <head> <meta charset="utf-8"> ...
Html CSS的三种链接方式
感谢原文:https://blog.csdn.net/abc5382334/article/details/24260817 感谢原文:https://blog.csdn.net/jiaqingge/ ...
CSS+HTML快速入门链接样式雪碧图（案例）
目录一.伪类的使用 1.html部分: 二.横向主菜单 1.images图片部分: 2.css部分: 3.html部分: 三.外部样式 1.css部分: 2.html部分: 四.制作顶部菜单(综合) ...
Rt-thread [三] link.lds链接脚本详解
Rt-thread [三] link.lds文件详解前言程序编译流程什么是链接基本概念 RT-thread stm32f407 link.lds链接脚本详解资料前言开一个专题,记录自 ...
如何用CSS实现图像替换链接文本显示并保证链接可点击
一个很普通的网页中显示LOGO图像,按照以往的页面制作经验,基本是在页面中插入图像即可(<img src="logo.gif" />),不过以新WEB标准进行CSS布局 ...
[css] 怎么使用css选择空链接？
[css] 怎么使用css选择空链接? <!DOCTYPE html> <html lang="en"> <head><meta char ...

hltm连接css的link,CSS 链接(link)

hltm连接css的link,CSS 链接(link)相关推荐

最新文章

热门文章