【示例】
-
HTML
<div id="quickSummary"> <p class="p1"><span>展示以<acronym title="cascading style sheets">CSS</acronym>技术为基础,并提供超强的视觉冲击力。只要选择列表中任意一个样式表,就可以将它加载到本页面中,并呈现不同的设计效果。</span></p> <p class="p2"><span>下载<a title="这个页面的HTML源代码不能够被改动。" href="http://www.csszengarden.com/zengarden-sample.html">HTML文档</a> 和 <a title="这个页面的CSS样式表文件,你可以更改它。" href="http://www.csszengarden.com/zengarden-sample.css">CSS文件</a>。</span></p> </div>
-
CSS
body {/* 网页背景颜色 */ background:#fcc; /* 浅色背景 */ } a {/* 超链接的默认样式 */ text-decoration:none; /* 清除超链接下划线 */ border:solid 1px; /* 定义1像素实线边框 */ padding: 0.4em 0.8em; /* 增加超链接补白 */ color: #444; /* 定义灰色字体 */ background: #f99; /* 超链接背景色 */ border-color: #fff #aaab9c #aaab9c #fff; /* 分配边框颜色 */ zoom:1; /* 解决IE浏览器无法显示问题*/ } a:hover {/* 鼠标经过时样式 */ color: #800000; /* 超链接字体颜色 */ background: transparent; /* 清除超链接背景色 */ border-color: #aaab9c #fff #fff #aaab9c; /* 分配边框颜色 */ }