不定义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. TWF

    design seq1_b3 sta_label 0.0-1.0 0.0-1.0 1e-9 # clocks# clockID clock_name period rise_edge fall_edg ...

  2. bootstrap4的改进

  3. codeforces 1288C. Two Arrays（dp）

    链接:https://codeforces.com/contest/1288/problem/C C. Two Arrays 题意:给定一个数n和一个数m,让构建两个数组a和b满足条件,1.数组中所有 ...

  4. dp--B - Hard problem

    B - Hard problem Vasiliy is fond of solving different tasks. Today he found one he wasn't able to so ...

  5. borderInterpolate()函数

    官网:borderInterpolate borderInterpolate 函数原型 int borderInterpolate( int p, int len, int borderType ); ...

  6. ftp的相关配置

    参考 https://www.cnblogs.com/hexige/p/7809481.html 访问参数

  7. 【音乐欣赏】《紅蓮華》 - LiSA

    曲名:紅蓮華 作者:LiSA [00:00.92]強くなれる理由を知った [00:07.34]僕を連れて 進め [00:18.74]泥だらけの走馬灯に酔う [00:24.37]強張る心 震える手は [ ...

  8. Iris项目结构

  9. 基于原生PHP的路由分配实现

    对于由原生PHP写成的独立PHP框架,利用单一入口文件实现路径的访问.这时我们会遇到的首要问题是:文件的相互包含,其次就是路由分配.当我们不利用成熟的PHP框架进行web开发时,我们就会发现上述两个问 ...

  10. CentOS 7 使用笔记

    一.下载.解压或安装等命令: 目前自己用过的三个下载及安装命令:curl.wget.yum. yum用法: $ sudo yum install libpng16-1.6.29-alt1.i586.r ...