SOURCE

<ul>
<li><a href="http://www.runoob.com/css/css-examples.html">登陆</a></li>
<li><a href="http://www.runoob.com/css/css-examples.html">注册</a></li>
<li><a href="http://www.runoob.com/css/css-examples.html">返回</a></li>
<li><a href="http://www.runoob.com/css/css-examples.html">退出</a></li>
</ul>
<div class="background">
<div class="transbox">
<p>我想起了自己的梦想。我喜欢看书，喜欢写东西，脑袋常常像一枝迎春花的枝条一样，<br>
   风一吹就冒出一骨朵一骨朵想象的奇花来。我想当个作家，身边随时有一叠洁白的稿纸，<br>
	一支出水流畅的黑钢笔，把我所感受到的美好和悲哀都一点一滴地写下来，<br>
	构成一个用文字创造的宏大世界。想写的时候就写，无话可说的时候就静静看风吹过石榴叶，<br>
	再也不要为某种目的而写。我想起了我的老实巴交的爸爸，我从来没有像现在这样更深地了解他，<br>
	热爱他，我很愿意像他一样，无论将来的前程如何远大，都做一颗亲切而温暖的“五角星”。<br>
	——赵菱《兔子女孩和她的薄荷田--六角星》
</p>
</div>
</div>

body
{
	background-image:url('http://pic.90sjimg.com/back_pic/qk/back_origin_pic/00/02/29/804033ff5e3a1d42abd9a7d62f59e222.jpg');
	background-repeat:no-repeat;
	background-position:left top;
	margin-right:200px;
}

ul
{
	list-style-type:none;
	margin:0;
	padding:0;
	overflow:hidden;
  
  
}
li
{
	float:left;
}
a:link,a:visited
{
	display:block;
	width:200px；
  font-weight:bold;
	color:#FFFFFF;
	background-color:0000ff;
	text-align:center;
	padding:4px;
	text-decoration:none;
  text-transform:uppercase;
   opacity:0.5;
	
}
a:hover,a:active
{
	background-color:#dbdbf8;
}

div.transbox
{ float:left;
  width: 350px;
  height: 400px;
  margin:100px 300px;
  background-color: #ffffff;
  border: 5px solid black;
  opacity:0.5;
  filter:alpha(opacity=60); /* For IE8 and earlier */
}
div.transbox p
{
  
  margin: 35px 30px;
  font-weight: bold;
  color: #000000;
}
p:first-letter
{
	color:#ff0000;
	font-size:xx-large;
}
p:first-line 
{
	color:#0000ff;
  font-variant:small-caps;}
  body
{
	margin:0;
	padding:0;
}
a:link {color:#000000;}      /* 未访问链接*/
a:visited {color:pink;}  /* 已访问链接 */
a:hover {color:#ffffff;}  /* 鼠标移动到链接上 */
a:active {color:#dbdbf8;}