首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > CSS >

如何在一行显示下面代码

2012-02-06 
怎么在一行显示下面代码?我想让dtdddd在一行显示,显示为:J2SE(TM)5.0专题之语言特性佚名[2007-4-24]可是显

怎么在一行显示下面代码?
我想让dt   dd   dd   在一行显示,
显示为:   J2SE(TM)   5.0专题   之   语言特性   佚名   [2007-4-24]
可是显示不在一行上,   这是怎么回事呢?
以下代码,   可以怎么改进呢?

<div   id= "recent ">
<dl>
<div   class= "div ">
<dt>
  <a   href= "# "> J2SE(TM)   5.0专题   之   语言特性 </a> </dt>
    <dd> 佚名 </dd>
    <dd> [2007-4-24] </dd>
    <dt>
  <a   href= "# "> J2SE(TM)   5.0专题   之   语言特性 </a> </dt>
    <dd> 佚名 </dd>
    <dd> [2007-4-24] </dd>
</div>

</dl>
</div>


#recent{
    margin-top:2em;
}
#recent   dd   {
display:   inline;

}

#recent   dt{
line-height:1.0;

padding:1em   0   0   0.4em;
margin:0.75em   0   0.8em;
background-image:   url(icon-star.gif);
background-repeat:   no-repeat;
background-position:   left   bottom;

}

#recent   .div{
border-top:1px   dashed   #b6c8b0;
display:   inline;
}

[解决办法]
<style type= "text/css ">

#recent{
margin-top:2em;
width:400px;
}
#recent dd {
float:left;
padding:0.6em 0 0.4em 0.4em;
display: inline;

}

#recent dt{
float:left;
line-height:1em;
padding:0.6em 0 0.4em 0.4em;
background-image: url(icon-star.gif);
background-repeat: no-repeat;
}

#recent .div{
float:left;
border-top:1px dashed #b6c8b0;
display: inline;
}

楼上,你试试

</style>

<div id= "recent ">
<div class= "div ">
<dt>
<a href= "# "> J2SE(TM) 5.0专题 之 语言特性 </a> </dt>
<dd> 佚名 </dd>
<dd> [2007-4-24] </dd>
</div>
<div class= "div ">
<dt>
<a href= "# "> J2SE(TM) 5.0专题 之 语言特性 </a> </dt>
<dd> 佚名 </dd>
<dd> [2007-4-24] </dd>
</div>
</div>

热点排行