不定义css样式时（默认情况）：

代码如下：

<!DOCTYPE html>

<html>

    <head>

        <meta charset="utf-8" />

        <title></title>

    </head>

    <body>

        <dl>

            <dt>hello</dt>

            <dd>xiaohao</dd>

        </dl>

    </body>

</html>

运行结果如下：

方法一：

1.设置全局样式

*{

margin:0;

}

方法二：

2.给dd设置样式

dd{

margin:0;

}

设置css样式后：

代码如下：

<!DOCTYPE html>

<html>

    <head>

        <meta charset="utf-8" />

        <title></title>

        <style>

            dd{

                margin: 0px;

            }

        </style>

    </head>

    <body>

        <dl>

            <dt>hello</dt>

            <dd>xiaohao</dd>

        </dl>

    </body>

</html>

运行结果为：

ul与li对齐方法类似，ul存在内边距，设置ul的内边距为0，即可实现ul与li对齐。

注：

设置dt{float:left;}可以让dd，dt在同一行显示；

定义列表dl中标签 dt 与标签dd对齐方法，标签ul与标签li对齐的更多相关文章

  1. 前端 HTML body标签相关内容 常用标签 定义列表<dl>

    定义列表<dl> 定义列表的作用非常大. <dl>英文单词:definition list,没有属性.dl的子元素只能是dt和dd. <dt>:definition ...

  2. 有序列表ol，无序列表ul，定义列表dl

    ====================非常重要=================无序列表ul中有一个type属性四个属性值type="disc" 实心圆点(默认) type=&q ...

  3. 有序列表ol和定义列表dl，dt，dd

    有序列表是一种讲究排序列表结构,使用<ol>标签定义,其中包含多个<li>列表项目.一般网页设计中,列表结构可以互用有序或者无序类表标签.但是,在强调项目排序栏目中,选用有序列 ...

  4. css中实现ul两端的li对齐外面边缘

    其实就是设置ul的宽度大一些就好

  5. 前端学习 -- Css -- 定义列表

    定义列表用来对一些词汇或内容进行定义 使用dl来创建一个定义列表 dl中有两个子标签 dt : 被定义的内容 dd : 对定义内容的描述 同样dl和ul和ol之间都可以互相嵌套 <!DOCTYP ...

  6. HTML 有序、无序和定义列表

    无序列表 <ul> <li>咖啡</li> <li>茶</li> <li>牛奶</li> </ul> 咖 ...

  7. maven的setting.xml文件中只配置本地仓库路径的方法

    maven的setting.xml文件中只配置本地仓库路径的方法 即:settings标签下只有一个 localRepository标签,其他全部注释掉即可 <?xml version=&quo ...

  8. 如何用PC标签在列表页中调出文章内容 phpcms

    如何用PC标签在列表页中调出文章内容 phpcms v9 moreinfo=”"参数说明 {pc:content action="lists" catid="$ ...

  9. 用struts2标签如何从数据库获取数据并在查询页面显示。最近做一个小项目，需要用到struts2标签从数据库查询数据，并且用迭代器iterator标签在查询页面显示，可是一开始，怎么也获取不到数据，想了许久，最后发现，是自己少定义了一个变量，也就是var变量。

    最近做一个小项目,需要用到struts2标签从数据库查询数据,并且用迭代器iterator标签在查询页面显示,可是一开始,怎么也获取不到数据,想了许久,最后发现,是自己少定义了一个变量,也就是var变 ...

随机推荐

  1. shell 预定义变量

    echo "上一次后台pid is $!"echo "当前进程pid is $$"echo "last command return code is ...

  2. IntelliJ IDEA 2017.3来自百度----idea原生快捷键

    常用 Ctrl+R  查找加替换 Ctrl+Alt+回车 从当前行,向上加一行 Shift+回车 从当前行,向下加下一行 Ctrl+Alt+L 格式化代码 Ctrl+/ // Ctrl+Shift+/ ...

  3. 普及C组第三题（8.13）

    2334. [NOIP普及组T2]战斗 (File IO): input:fight.in output:fight.out 时间限制: 1000 ms  空间限制: 524288 KB 开始贴图:. ...

  4. Jquery拖拽，拖动排序插件

    上github搜jquery-sortable <!-- jq拖拽排序 --> <script src="${contextPath}/static/excelTable/ ...

  5. 命令行（一）：Git

    1,使用gitbash进行操作 2,初始化一个Git仓库,使用git init命令. 3,添加文件到Git仓库,分两步:使用命令git add <filename>可反复多次使用,添加多个 ...

  6. SSH通道 Xshell

    SSH是每一台Linux电脑的标准配置. SSH是一种网络协议,用于计算机之间的加密登录(安全的). 1.  登录远程主机    $ ssh user@host    2.  SSH的默认端口是22, ...

  7. HTML5学习（2）语义化

    什么是语义化? 1.每一个HTML元素都有具体的含义,例: a元素:超链接,p元素:段落 2.所有的元素与展示效果无关 元素内容展示到页面中的效果,应该由CSS决定. 因为浏览器带有默认的CSS样式, ...

  8. Collection两个常见的集合类型: ArrayList可重复集有序 ，HashSet不可重复集

    package seday11; import java.util.ArrayList; import java.util.Collection; import java.util.HashSet; ...

  9. 2.4 【配置环境】TestNG安装

    两种方法可以安装TestNG Eclipse插件:  (来源:http://blog.csdn.net/hongchangfirst/article/details/7679849/) 第一种,离线安 ...

  10. PHP 操作oracle数据库，select，insert into ,delete，update等

    建完数据库,下面就是操作数据库啦 程序的根源无非是增删改查 首先最基础的查询 public function obtainduo(){ header("content-type:text/h ...