CSS按钮实例演示 – 筚路蓝缕

&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"&gt;
&lt;html&gt;
&lt;head&gt;
&lt;title&gt;吹牛b点坑 - CSS按钮实例演示&lt;/title&gt;
&lt;style type="text/css"&gt;
&lt;!--
#menu {
  width:8em;
  padding:0.5em;
  background:#ccc;
  font-family: "Terminal";
 }
#menu a, #menu a:visited {
 display:block;
 width:7em;
 color:#669900;
 text-align:center;
 background-color:#fff;
 text-decoration:none;
 margin:0.5em 0;
 border-left:0.5em solid #9ab;
 }
#menu a:hover {
 color:#f00;
 border-left:0.5em solid #000;
 }
.box {
 position:relative;
 }
--&gt;
&lt;/style&gt;
&lt;/head&gt;

&lt;body&gt;
&lt;div id="menu"&gt;
 &lt;div class="box"&gt;
 &lt;a href="http://liuleng.com/"&gt;
 吹牛b点坑
 &lt;/a&gt;
 &lt;/div&gt;
 &lt;div class="box"&gt;
 &lt;a href="http://liuleng.com/"&gt;
 首页
 &lt;/a&gt;
 &lt;/div&gt;
 &lt;div class="box"&gt;
 &lt;a href="http://liuleng.com/"&gt;
 设计
 &lt;/a&gt;
 &lt;/div&gt;
 &lt;div class="box"&gt;
 &lt;a href="http://liuleng.com/"&gt;
 教程
 &lt;/a&gt;
 &lt;/div&gt;
 &lt;div class="box"&gt;
 &lt;a href="http://liuleng.com/"&gt;
 资源
 &lt;/a&gt;
 &lt;/div&gt;
&lt;/div&gt;

&lt;/body&gt;
&lt;/html&gt;

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

<head>

<title>吹牛b点坑 - CSS按钮实例演示</title>

<!--

#menu {

width:8em;

padding:0.5em;

background:#ccc;

font-family: "Terminal";

}

#menu a, #menu a:visited {

display:block;

width:7em;

color:#669900;

text-align:center;

background-color:#fff;

text-decoration:none;

margin:0.5em 0;

border-left:0.5em solid #9ab;

}

#menu a:hover {

color:#f00;

border-left:0.5em solid #000;

}

.box {

position:relative;

}

-->

</style>

</head>

<body>

吹牛b点坑

</a>

</div>

首页

</a>

</div>

设计

</a>

</div>

教程

</a>

</div>

资源

</a>

</div>

</body>

</html>

一	二	三	四	五	六	日
	1	2	3	4	5	6
7	8	9	10	11	12	13
14	15	16	17	18	19	20
21	22	23	24	25	26	27
28	29	30	31

发表回复 取消回复

相关文章

发表回复取消回复