首页 >web前端 >前端问答 > 正文

css怎么设置正在访问的链接背景

原创2021-09-10 16:11:320250
线上培训班

在css中,可以利用“:active”选择器和background属性来设置正在访问的链接背景,只需要给链接添加“a:active{background:颜色值/url('图片url');}”样式即可设置正在访问时链接的背景颜色或背景图片。

本教程操作环境:windows7系统、CSS3&&HTML5版、Dell G3电脑。

css设置正在访问的链接背景

在鼠标点击链接时,设置其背景颜色为黄色。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<style type="text/css">
			a:active {
				background: yellow;
				/* background:url(img/1.jpg); */
			}
		</style>
	</head>
	<html>
		<body>
			<a href="#">链接</a>
		</body>
	</html>

效果图:

1.gif

说明:

:active 选择器可以设置当你点击链接时的样式。

当你点击一个链接时它变成活动链接,而:active会向活动的链接添加特殊的样式。

提示: :link 选择器设置了未访问过的页面链接样式, :visited 选择器设置访问过的页面链接的样式, :hover 选择器当有鼠标悬停在其上的链接样式。

注意: 为了产生预期的效果,在CSS定义中,:active必须位于:hover之后!!

推荐教程:《CSS视频教程

以上就是css怎么设置正在访问的链接背景的详细内容,更多请关注php中文网其它相关文章!

php中文网最新课程二维码

声明:本文原创发布php中文网,转载请注明出处,感谢您的尊重!如有疑问,请联系admin@php.cn处理

相关文章

相关视频


网友评论

文明上网理性发言,请遵守 新闻评论服务协议

我要评论
  • 专题推荐

    作者信息
    推荐视频教程
  • CSS高级实例视频教程CSS高级实例视频教程
  • CSS3进阶视频教程CSS3进阶视频教程
  • CSS3精讲视频教程CSS3精讲视频教程
  • 让布局像5G一样快:CSS Grid网格布局让布局像5G一样快:CSS Grid网格布局
  • Web开发基础_HTML+CSSWeb开发基础_HTML+CSS
  • 新独孤九贱之:CSS3 必知内容新独孤九贱之:CSS3 必知内容
  • 视频教程分类