- 要求如下：
- 宽度自适应
- 标题文字自适应
- 尽量用一张背景图
- 尽量少的嵌套
代码：
<!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=gb2312" />
<title>自适应宽度标题</title>
<style>
body{margin:0; padding:20px; font-size:12px;}
.box{background:url(2.gif) no-repeat; height:28px; padding:0 0 0 20px; margin:0 0 10px 0;}
.innerbox{background:url(2.gif) no-repeat right 0; height:22px; padding:6px 0 0 0;}
.title{background:url(2.gif) no-repeat -128px -29px; height:22px; float:left; padding:0 0 0 5px;}
.title span{background:url(2.gif) no-repeat right -29px; height:16px; padding:6px 10px 0 5px; float:left; color:#F60; font-weight:bold;}
.title1{width:150px;}
.title2{width:200px;}
.title3{width:300px;}
</style>
</head>
<body>
<div class="box title1">
<div class="innerbox">
<div class="title">
<span>我是第一</span>
</div>
</div>
</div>
</body>
</html>
