7-2.html

来自「一些css样式表的例子供大家学习和参考。」· HTML 代码 · 共 42 行

HTML
42
字号
<html>
<head>
<title>按钮超链接</title>
<style>
<!--
a{										/* 统一设置所有样式 */
	font-family: Arial;
	font-size: .8em;
	text-align:center;
	margin:3px;
}
a:link, a:visited{						/* 超链接正常状态、被访问过的样式 */
	color: #A62020;
	padding:4px 10px 4px 10px;
	background-color: #ecd8db;
	text-decoration: none;
	border-top: 1px solid #EEEEEE;		/* 边框实现阴影效果 */
	border-left: 1px solid #EEEEEE;
	border-bottom: 1px solid #717171;
	border-right: 1px solid #717171;
}
a:hover{								/* 鼠标经过时的超链接 */
	color:#821818;						/* 改变文字颜色 */
	padding:5px 8px 3px 12px;			/* 改变文字位置 */
	background-color:#e2c4c9;			/* 改变背景色 */
	border-top: 1px solid #717171;		/* 边框变换,实现“按下去”的效果 */
	border-left: 1px solid #717171;
	border-bottom: 1px solid #EEEEEE;
	border-right: 1px solid #EEEEEE;
}
-->
</style>
   </head>
<body>
	<a href="#">首页</a>
	<a href="#">心情日记</a>
	<a href="#">学习心得</a>
	<a href="#">工作笔记</a>
	<a href="#">生活琐碎</a>
	<a href="#">其他</a>
</body>
</html>

⌨️ 快捷键说明

复制代码Ctrl + C
搜索代码Ctrl + F
全屏模式F11
增大字号Ctrl + =
减小字号Ctrl + -
显示快捷键?