按钮式超连接

最新推荐文章于 2025-07-22 00:16:16 发布

weixin_30515513

最新推荐文章于 2025-07-22 00:16:16 发布

阅读量92

点赞数

CC 4.0 BY-SA版权

文章标签： xhtml

原文链接：http://www.cnblogs.com/suzongwei/archive/2008/06/13/1219885.html

本文通过一个具体的实例展示了如何使用CSS来美化网页导航栏，包括统一设置样式、定义不同状态下的超链接样式等，对于理解CSS应用非常有帮助。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>无标题文档</title>

<style type="text/css">

a{

}{

/**//*统一设置所有样式*/

font-family:Arial, Helvetica, sans-serif;

font-size:.8em;

text-align:center;

margin:3px;

}

a:link,a:visited{

}{

/**//*超链接正常状态，被访问过的样式*/

color:#a62020;

padding:4px 10px;

background-color:#ecd8db;

text-decoration:none;

border-top:1px solid #eee;/**//*边框实现阴影效果*/

border-left:1px solid #eee;

border-right:1px solid #717171;

border-bottom: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-right:1px solid #eee;

border-bottom:1px solid #eee;

}

</style>

</head>

<body>

<a href="#">Home</a>

<a href="#">Contact</a>

<a href="#">Web Dev</a>

<a href="#">Web Design</a>

<a href="#">Map</a>

</body>

</html>

转载于:https://www.cnblogs.com/suzongwei/archive/2008/06/13/1219885.html

评论

被折叠的条评论为什么被折叠?

到【灌水乐园】发言

查看更多评论

添加红包

成就一亿技术人!

hope_wisdom

发出的红包

实付元

使用余额支付

点击重新获取

扫码支付

钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。