css dl dt dd使用实例教程

好了我们再来看一篇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.net/cssdiv/css.html

时间: 2024-11-05 06:26:01

css dl dt dd使用实例教程的相关文章

DIV CSS网页布局中常用的列表元素ul ol li dl dt dd释义

核心提示:DIV CSS网页布局中常用的列表元素ul ol li dl dt dd释义 ol 有序列表 <ol><li>--</li><li>--</li><li>--</li></ol> 表现为 1--2--3-- ul 无序列表,表现为li前面是大圆点而不是123 <ul><li>--</li><li>--</li></ul> 很多人容

div+css布局必了解的列表元素ul ol li dl dt dd详解_经验交流

块级元素div尽量少用,其实和table一样,嵌套越少越好,它也是会影响速度的! ol 有序列表. <ol> <li>--</li> <li>--</li> <li>--</li> </ol> 表现为: 1-- 2-- 3-- ul 无序列表,表现为li前面是大圆点而不是123 <ul> <li>--</li> <li>--</li> </ul&

网页布局中常用的列表元素ul ol li dl dt dd讲解

网页 DIV CSS网页布局中常用的列表元素ul ol li dl dt dd释义,块级元素div尽量少用,和table一样,嵌套越少越好 ol 有序列表. <ol><li>--</li><li>--</li><li>--</li></ol> 表现为: 1--2--3-- ul 无序列表,表现为li前面是大圆点而不是123 <ul><li>--</li><li>-

dl dt dd 标签的用法(一)

 html标签中 是一组合标签,使用了dt dd最外层就必须使用dl包裹,此组合标签我们也又叫表格标签,与table表格类似组合标签,故名我们也叫dl表格.    为常用标题+列表型标签.如没有对dl dt dd标签初始CSS样式,默认dd列表内容会一定缩进.    一般的写法:        首先dt和dd是放于dl标签内,标签dt与dd处于dl下相同级.也就是dt不能放入dd内,dd不能放入dt内.在dl下,dt与dd处于同级标签.DD标签可以若干.同时不能不加dl地单独使用dt标签或dd标

dl dt dd 标签的用法(二)

 dl>< /dl>用来创建一个普通的列表  < dt>< /dt>用来创建列表中的上层项目  < /dd>用来创建列表中最下层项目   < dt>< /dt>和< dd>< /dd>都必须放在< dl>< /dl>标志对之间. 解释下这里为什么说dt和dd分别创建上层和下层的项目.dt和dd如果不加浮动的话,是自己在一行的,也就是块元素.所以这里写的是上层和下层. 1: 看下源码

dl,dt,dd作用与用法

dl,dt,dd作用与用法 我们在制作网页过程中用到列表时一般会使用<ul>或者<ol>标签,很少用刑<dl>标签,但是这个三个标签却有着不可忽视的作用,毕竟Web标准中要尽最大可能的使用已有的标签.它们的用途是: < dl>< /dl>用来创建一个普通的列表,   < dt>< /dt>用来创建列表中的上层项目, < dd>< /dd>用来创建列表中最下层项目, < dt>< /

dl dt dd的嵌套使用

dl dt dd的嵌套使用 dd元素中可以包含block元素,而dt中只能包含inline元素, 在dd中可以包含dl元素 效果是这样的,主要的是效果是在dd中加了一个表格,如果使用表格来实现的话,有点困难,要计算表头要跨越几行,或者使用大表格套个小表格的形式, <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-t

HTML 中的 dl(dt,dd)、ul(li)、ol(li) 使用方法

 HTML <dl> 标签 #定义和用法 <dl> 标签定义了定义列表(definition list). <dl> 标签用于结合 <dt> (定义列表中的项目)和 <dd> (描述列表中的项目). #实例 代码如下: <dl> <dt>计算机</dt> <dd>用来计算的仪器 ... ...</dd> <dt>显示器</dt> <dd>以视觉方式显示

dl dt dd标签用法

一般我们在做列表的时候通常只会用到ul和li标签,至于DL一般都很少用到,它也属于列表类的标签,下面说一下大概的用法: <dl>标记定义了一个定义列表,定义列表中的条目是通过使用<dt>标记("definition title",定义标题)和<dd>标记("definition description",定义描述)创建的.<dt>给出了术语名,<dd>标记给出了术语的定义. 也就是说<dt>用来