HTML 学习笔记 CSS样式（链接）
我们能够以不同的方法为链接设置样式。
设置链接的样式
能够设置链接样式的 CSS 属性有很多种（例如 color, font-family, background 等等）。
链接的特殊性在于能够根据它们所处的状态来设置它们的样式。
链接的四种状态
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之后
例子:
1:向链接添加不同的样式
<head>
<meta charset="UTF-8">
<title>链接</title>
<style type="text/css">
a:link {
color: #00FFFF;
font-size: 10px;
text-decoration: none;
}
a:visited {
color: #FF0000;
font-size:25px;
text-decoration: underline;
}
a:hover {
color: blue;
font-size: 30px;
text-decoration: underline;
background-color: gray;
}
a:active {
color: orange;
font-size: 20px;
text-decoration: none;
background-color: purple;
}
</style>
</head>
<body>
<p><b><a class="one" href="http://www/baidu.com">百度一下</a></b></p>
</body>
高级 - 创建链接框
<head>
<meta charset="UTF-8">
<title>链接</title>
<style type="text/css">
a:link ,a:visited{
/*把标签a设置为块级元素*/
display: block;
width: 120px;
font-weight: bold;
font-size: 14px;
background-color: #98bf21;
font-family: "french script mt";
color: #ffffff;
text-align: center;
padding: 4px;
text-decoration: none;
}
a:hover, a:active{
background-color: #7a991a;
} </style>
</head>
<body>
<a href="http:www.baidu.com" target="_blank">百度一下</a>
</body>
HTML 学习笔记 CSS样式（链接）的更多相关文章
- HTML 学习笔记 CSS样式（定位）
CSS定位(Positioning)属性 允许你对元素进行定位. CSS定位和浮动 CSS为定位和浮动提供了一些属性,利用这些属性 可以建立列式布局,将布局的一部分与另一部分重叠.还可以完成多年来通常 ...
- HTML 学习笔记 CSS样式（框模型）
CSS框模型( Box Model)规定了元素框处理元素的内容 内边距 边框 和 外边距的方式 CSS框模型概述 可以用下面的模型图概述
- HTML 学习笔记 CSS样式（外边框 外边框合并）
CSS外边距 围绕在元素边框的空白区域就是外边距 设置外边距会在元素外创建额外的空白 设置外边距的最简单的方法就是使用 margin 属性,这个属性接受任何长度单位.百分数值甚至负值. CSS ma ...
- HTML 学习笔记 CSS样式（边框）
元素的边框(border)是围绕元素内容和内边距的一条或多条线 CSS border 属性允许你规定边框的样式 宽度和颜色 CSS 边框 在 HTML 中,我们使用表格来创建文本周围的边框,但是通过使 ...
- HTML 学习笔记 CSS样式（字体）
css字体属性定义文本的字体系列 大小 加粗 风格 和 变形(如小型大写字母(类似于大写字母字体变小了)) css字体系列 在css中 有两种不同类型的字体系列名称 1.通用字体系列 - 拥有相似外观 ...
- HTML 学习笔记 CSS样式（文本）
CSS文本属性可以定义文本的外观 通过文本属性 您可以改变文本的颜色 字符间距 文本对齐装饰文本 对文本进行缩进等等. 缩进文本 把web页面上的段落的第一行缩进,这是最常用的文本格式化效果. css ...
- HTML 学习笔记 CSS样式（简介和语法）
CSS概述 CSS指层叠样式表(Cascading Style Sheets) 样式定义如何显示HTML元素 样式通常存储在样式表中 把样式添加到HTML4.0中 是为了解决内容与表现分离的问题 外部 ...
- HTML 学习笔记 CSS样式（相对定位 绝对定位）
CSS相对定位 设置为相对定位(relative)的元素会偏移某个距离.元素仍保持其未定位前的形状,他原本所占的空间仍然保留 CSS相对定位 相对定位是一个非常容易掌握的概念,如果对一个元素进行相对定 ...
- HTML 学习笔记 CSS样式（背景）
背景色 可以使用background-color属性为元素设置背景色 这个属性接受任何合法的颜色值. 可以使用background-image属性来喂元素设置背景图片. 背景重复 如果需要在页面上对背 ...
随机推荐
- 操作系统开发系列—10.内核HelloWorld ●
a.我们先来体验一下在Linux下用汇编编程的感觉,见代码 [section .data] ; 数据在此 strHello db "Hello, world!", 0Ah STRL ...
- iOS开发--Swift 如何完成工程中Swift和OC的混编桥接(Cocoapods同样适用)
由于SDK现在大部分都是OC版本, 所以假如你是一名主要以Swift语言进行开发的开发者, 就要面临如何让OC和Swift兼容在一个工程中, 如果你没有进行过这样的操作, 会感觉异常的茫然, 不用担心 ...
- 【读书笔记】iOS网络-异步请求与运行循环
异步请求需要运行循环.当数据传递到服务器或是被客户端接收时,运行循环用于实现事件与委托对象之间的通信.异步请求在发出时,会在当前线程的运行循环上操作,这个实现细节是很重要的,因为在GCD块中或者是通过 ...
- 学习Coding-iOS开源项目日志（三）
继续前两篇,接着本第三篇<学习Coding-iOS开源项目日志(三)>讲解Coding-iOS开源项目. 前 言:作为初级程序员,想要提高自己的水平,其中一个有效的学习方法就是学习别人好的 ...
- IrfanView 4.36 中文版发布了
IrfanView 4.36 简体中文便携版 小而快的图片浏览器 仅仅不到2M的小软件,功能却能与体积大到几十M的ACDSee相媲美!这个软件就是IrfanView.图片.音频.视频浏览,图片批量格式 ...
- 【hadoop】——压缩工具比较
文件压缩主要有两个好处,一是减少了存储文件所占空间,另一个就是为数据传输提速.在hadoop大数据的背景下,这两点尤为重要,那么我现在就先来了解下hadoop中的文件压缩. hadoop里支持很多种压 ...
- SQL Server 中获取字符串拼音的标量函数实现
工作中时常遇到字符串转换为拼音的需求.特别目前在各大网站平台都可以看到的基于拼音的查询功能.如果在查询中增加相应的拼音查询,就可以减少很多的因中文汉字完全输入的不便利,例如:当我要查询叫”郭德 ...
- IntelliJ IDEA14.1中java项目Maven中没有配置JDK时的问题
在IntelliJ IDEA 14.1中使用在java项目中使用Maven时当没有在Maven中配置JDK编译版本.源码版本时,IDEA将默认的编译版本.源码版本设置为jdk5. 在IDEA中Lang ...
- iOS OC和Swift进行互相调用
有时候 ,我们会涉及到双向混合编程,特别是OC和swift的互相引用. swift调用oc的方法: 1.桥接文件,一般是swift工程,在创建一个oc文件时,系统自动添加(不用改名,直接默认即可) 2 ...
- https协议了解，以及相关协议的解析
HTTPS简介 HTTPS(全称:Hyper Text Transfer Protocol over Secure Socket Layer),是以安全为目标的HTTP通道,简单讲是HTTP的安全版. ...