这是一个CSS Teaser Box 的范例。因为宽度已经固定，所以我使用了两个背景图象（tsr-b.gif 和 tsr-t.gif）来创建圆角、顶部边框和底部边框。CSS被用于左侧边框以及右侧边框。Box可以垂直扩展，填入更多的文本内容，任何尺寸皆可。通过查看源码，你可以观察XHTML和CSS。你如果想看看相关博客，获悉更进一步的注释和讨论，请参考：CSS Teaser Box 和CSS teaser box回顾 。

Code:
 <style type="text/css" media="screen,print">
 html,
 body {
  margin:0;
  padding:0;
  color:#000;
  background:#fff;
 }
 body {
  padding:20px;
  font:76%/140% "Lucida Grande", "Lucida Sans Unicode", Verdana, Arial, Helvetica, sans-serif;
 }
 #labfooter {
  text-align:center;
  clear:both;
 }
 .adwrap {
  margin:30px auto 10px;
  padding:10px 0;
  width:468px;
  border:1px solid #ccc;
  border-width:1px 0;
 }
 .adwrap object {
  width:468px;
  height:60px;
 }

 .teaser {
  width:430px;
  padding:0 0 14px 0;
  margin:10px auto;
  background:url("tsr-b.gif") bottom left no-repeat;
 }
 .teaser h3 {
  margin:0;
  padding:7px 10px 3px 10px;
  background:url("tsr-t.gif") top left no-repeat;
 }
 .teaser p, .teaser a.more {
  margin:0;
  padding:0 10px 3px;
  border:1px solid #d8d8d8;
  border-width:0 1px;
 }
 .teaser a.more {
  display:block;
  text-align:right;
  background:url("tsr-a.gif") 410px 50% no-repeat;
  padding:0 24px 0 0;
  text-decoration:none;
  color:#44a;
 }
 .teaser a.more:hover {
  text-decoration:underline;
 }
 </style>