HTML5网页制作技术第20章 超链接样式

A. :link
B. :visited
C. :hover
D. :active
2、在实际开发中，如果想要定义超链接未访问时的样式，可以使用 （ ）。
A. a{}
B.a:visited{}
C. a:hover{]
D. a:active{}
3、我们可以使用（ ）来实现鼠标悬停在超链接上时为无下划线效
果。
A. a{text-decoration:underline;}
【疑问】：为什么我的浏览器中的超链接是紫色的呢？用color 属性重新定义也无效，这是怎么回事？
如果某一个地址的超链接在之前被点击过，浏览器就会记下 你的访问记录。那么下次你再用这个地址作为超链接地址时，由 于之前你已经访问过了，当然就是紫色的啦。小伙伴们换一个地 址就可以了。
20.2 深入了解:hover
第20章 超链接样式
教学重点
➢ 掌握超链接伪类 ➢ 深入了解:hover的使用场合 ➢ 掌握鼠标样式
20.1 超链接伪类
• 超链接在鼠标点击不同时期的样式是不一样的：
➢ 默认情况下：字体为蓝色，带有下划线 ➢ 鼠标点击时：字体为红色，带有下划线 ➢ 鼠标点击后：字体为紫色，带有下划线
• 在CSS中，我们可以使用“超链接伪类”来定义超链接在鼠 标点击的不同时期的样式。
• 在实际开发中，我们只会用到2种状态：未访问时状态和鼠 标经过状态。
• 语法：
a:link{…} a:visited{…} a:hover{…} a:active{…}
伪类 a:link a:visited a:hover a:active
说明 定义a元素未访问时的样式 定义a元素访问后的样式 定义鼠标经过a元素时的样式 定义鼠标点击激活时的样式
B. a{text-decoration:none;}
C. a:link{text-decoration:underline;}
D. a:hover{text-decoration:none;}
4、下面有关超链接样式说法中，正确的是（ ）。 A. 对于超链接的下划线，我们可以使用“text-decoration:none;”去
（1）未访问时：没有下划线，颜色为红色 （2）鼠标经过时：有下划线，颜色为蓝色பைடு நூலகம்
• “:hover伪类”可以定义任何一个元素在鼠标经过时的样式！ 注意，是任何元素！
• “:hover伪类”应用非常广泛，任何一个网站都会大量地用 到，请重点掌握。
20.3 鼠标样式
• 在CSS中，对于鼠标样式的定义，我们有2种方式：
➢ 浏览器鼠标样式 ➢ 自定义鼠标样式
1、浏览器鼠标样式
• 在CSS中，我们可以使用cursor属性来定义鼠标样式。 • 在实际开发中，我们一般只会用到default、pointer、text这3
个取值。 • 语法：
cursor:取值;
2、自定义鼠标样式
• 在CSS中，我们还可以使用cursor属性来自定义鼠标样式。 • 其中鼠标图片后缀名一般都是.cur，可以使用Photoshop来制
作 • 语法：
cursor: url(图片地址), 属性值;
练习题
一、单选题
1、下面哪一个伪类选择器是用于定义鼠标经过元素时样式的？（ ）
掉
B. cursor属性自定义鼠标样式时，使用的图片文件后缀名可以 是.png
C. :hover伪类只能用于a元素，不能用于其他元素 D. 对于超链接来说，在实际开发中，我们一般只会定义2种状态： 鼠标经过状态和点击后状态
二、编程题
1、在网页中添加一段文本链接，并且设置其在不同的状态下显示不 同的效果。要求：