龙盟编程博客 | 无障碍搜索 | 云盘搜索神器
快速搜索
主页 > web编程 > div+css/html >

css dl dt dd使用实例教程

时间:2012-12-31 10:44来源:未知 作者:admin 点击:
分享到:
好了我们再来看一篇css dl dt dd使用实例教程方法了,我们来看效果图. 下面来看看css如何写的吧. div id=commond span id=commondtitle用户留言/span dl dt class=commondname来一个爽的/dt dd class=commondtime

好了我们再来看一篇css dl dt dd使用实例教程方法了,我们来看效果图.

下面来看看css如何写的吧.

<div id="commond">
         <span id="commondtitle">用户留言</span>
                                                                                  <dl>
          <dt class="commondname">来一个爽的</dt>
          <dd class="commondtime">2008-10-14 11:03:44<dd>
          <dd class="commondcontent">哈哈&nbsp;看看,123456&nbsp;45<dd>
          
         </dl> 
                        <dl>
          <dt class="commondname">dumbiscool</dt>
          <dd class="commondtime">2008-10-13 16:11:19<dd>
          <dd class="commondcontent">妙趣的东西不错<dd>
          
         </dl> 
            <div style='text-align:right; padding-top:20px;'>记录2,有1页 <a href=?page=1 class='sf'>1</a><a href=?page=1>&nbsp;></a></div>         
        </div>
       </div>
       
      </div>

css div代码如下.

#commond{
margin:80px 0 20px -13px;
}
#commondtitle{
line-height:20px;
font-weight:bold;
padding:0 0 0 10px;
height:20px;
width:500px;
background:#fcf7bc;
}
#commond dl{
margin:30px 0 0 30px;
height:80px;
width:480px;
}
#commond dl dt{
margin:0 0 0px 20px;
font-weight:bold;
}
.commondtime{
margin:0 0 10px 20px;
}
.commondcontent{
margin:0 0 0 20px ;
padding:20px 10px 0 20px;
background:url(imgs/textareaback.gif) no-repeat top left #fcf7bc ;
height:60px;
width:420px
}

好了最后注明本站原创转载注明来自www.111cn.cn/cssdiv/css.html


精彩图集

赞助商链接