CSS之排列系列 |
您所在的位置：网站首页 › html中dl什么意思 › CSS之排列系列 |
CSS之排列系列
|
原文网址：CSS之排列系列--dl, dt, dd--使用/教程/实例_IT利刃出鞘的博客-CSDN博客 简介本文用示例介绍CSS中的dl, dt, dd的用法。 dl, dt, dd简介说明 dl, dt, dd是组合标签，使用了dt dd最外层就必须使用dl包裹，此组合标签我们也又叫表格标签，与table表格类似组合标签，故名我们也叫dl表格。 为常用标题+列表型标签。若没有对dl dt dd标签初始CSS样式，默认dd列表内容会缩进。 dl, dt, dd含义 dl：定义列表（Definition List）dt：定义术语（Definition Term）dd：定义描述（Definition Description） 示例1：默认格式代码 This is title 标题1 列表1 标题1 列表1 标题2 列表1 列表2结果
可以发现，dd标签会跟dt标签的内容的最后对齐。 示例2：dd与dt左对齐说明 将dd的margin设为0即可 代码 This is title dd { margin: 0; } 标题1 列表1 标题1 列表1 标题2 列表1 列表2结果
说明 居中的方法：dl的text-align设置为center； 并排的方法：dl的父元素设置为display: flex 代码 This is title .container { display: flex; } dl { margin: 10px; text-align: center; border: #1e17ff solid 2px; } dd { margin: 0; } 这是标题1 列表1 标题1 这是列表1 标题2 这是列表1 这是列表2结果
|
【本文地址】
今日新闻 |
推荐新闻 |