定义列表dl中标签 dt 与标签dd对齐方法,标签ul与标签li对齐
不定义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对齐的更多相关文章
- 前端 HTML body标签相关内容 常用标签 定义列表<dl>
定义列表<dl> 定义列表的作用非常大. <dl>英文单词:definition list,没有属性.dl的子元素只能是dt和dd. <dt>:definition ...
- 有序列表ol,无序列表ul,定义列表dl
====================非常重要=================无序列表ul中有一个type属性四个属性值type="disc" 实心圆点(默认) type=&q ...
- 有序列表ol和定义列表dl,dt,dd
有序列表是一种讲究排序列表结构,使用<ol>标签定义,其中包含多个<li>列表项目.一般网页设计中,列表结构可以互用有序或者无序类表标签.但是,在强调项目排序栏目中,选用有序列 ...
- css中实现ul两端的li对齐外面边缘
其实就是设置ul的宽度大一些就好
- 前端学习 -- Css -- 定义列表
定义列表用来对一些词汇或内容进行定义 使用dl来创建一个定义列表 dl中有两个子标签 dt : 被定义的内容 dd : 对定义内容的描述 同样dl和ul和ol之间都可以互相嵌套 <!DOCTYP ...
- HTML 有序、无序和定义列表
无序列表 <ul> <li>咖啡</li> <li>茶</li> <li>牛奶</li> </ul> 咖 ...
- maven的setting.xml文件中只配置本地仓库路径的方法
maven的setting.xml文件中只配置本地仓库路径的方法 即:settings标签下只有一个 localRepository标签,其他全部注释掉即可 <?xml version=&quo ...
- 如何用PC标签在列表页中调出文章内容 phpcms
如何用PC标签在列表页中调出文章内容 phpcms v9 moreinfo=”"参数说明 {pc:content action="lists" catid="$ ...
- 用struts2标签如何从数据库获取数据并在查询页面显示。最近做一个小项目,需要用到struts2标签从数据库查询数据,并且用迭代器iterator标签在查询页面显示,可是一开始,怎么也获取不到数据,想了许久,最后发现,是自己少定义了一个变量,也就是var变量。
最近做一个小项目,需要用到struts2标签从数据库查询数据,并且用迭代器iterator标签在查询页面显示,可是一开始,怎么也获取不到数据,想了许久,最后发现,是自己少定义了一个变量,也就是var变 ...
随机推荐
- Android 开发压缩图片
private Bitmap imageZoom(int position , Bitmap bitMap) { //图片允许最大空间 double maxSize =2 ...
- mysql update某个字段替换成某个值
UPDATE xc_admin_vehicle SET brandid= REPLACE(brandid, 19, 54) UPDATE xc_admin_models SET bid= REPLAC ...
- 什么是文件的BOM头,及BOM头有哪些坑?
1.什么是BOM? BOM是用来判断文本文件是哪一种Unicode编码的标记,其本身是一个Unicode字符("\uFEFF"),位于文本文件头部. 在不同的Unicode编码中, ...
- 通过Spring Resource接口获取资源
目录 1 Resource简介 2 通过ResourceLoader获取资源 3 在bean中获取Resource的方式 1 Resource简介 在S ...
- LED Decorative Light Supplier - Decorative Use Of LED Light Strips
Led strip refers to the led assembly in the ribbon of the FPC (flexible circuit board) or PCB hard b ...
- Linux上安装nodejs
https://github.com/nodejs/node-v0.x-archive/wiki/Installing-Node.js-via-package-manager#debian-and-u ...
- 一文明白所谓的CS与BS设计模式
CS设计模式 概念:CS设计模式,C代表的是Client,S代表的是Server.正如图中的所示,是客户机与服务器之间的交互.这种交互在早期的软件系统中,大多数都是采用这种模式,通过将任务合理分配到C ...
- 每日扫盲:eclipse快捷键 包括查找类、方法、变量汇总
[Ct rl+T] 搜索当前接口的实现类 1. [ALT +/] 此快捷键为用户编辑的好帮手,能为用户提供内容的辅助,不要为记不全方法和属性名称犯愁,当记不全类.方法和属性的名字时,多体验一下[ ...
- ServletContext的使用
ServletContext: ServletContext表示Servlet应用程序.每个Web应用程序只有一个上下文.在将一个应用程序同时部署到多个容器的分布式环境中,每台Java虚拟机上的Web ...
- Laravel Vuejs 实战:开发知乎 (5)设计问题表
1.执行命令: php artisan make:model Models/Question -cm 2.设计问题的数据库迁移文件中的字段: <?php use Illuminate\Datab ...