现在html里有两个dl怎么能让这两个dl在同一行内，而不是自动换行_随笔

在html中如何让两个dl对齐显示：实际效果来测试一下：

1、打开相关测试软件，设置两个css样式这里取名：dl1 dl2，在html中用dl标签引用这两个样式如下

<style>

.dll{ width:200px height:100px background-color:#F00 float:left}

.dl2{ width:200px height:100px background-color:#09F float:left}

</style>

详解：两个dl引用的css样式宽度width都为200px，高度height为100px，为了区分两个区域块是否在同一行显示，这里设置两个背景颜色dl1为#F00(红色)，dl2为#09F(浅蓝色)；主要css属性：float:left使其靠左浮动对齐，最后在html中用dl引用两个css样式；

注：float:left靠左浮动对齐

float:right靠右浮动对齐；

下方如果还有区域块儿请记得清除一下浮动：clear:both清除左右浮动，left清除左浮动，right清除右浮动；

2、网页中实现效果为：

html中，dl和dd和dt标签的意思如下：

1、dl标签定义了定义列表（definition list）。

2、dd是用来定义列表中定义条目的定义部分。

举例说明：

<html>

<body>

<h2>一个定义列表：</h2>

<dl>

<dd>用来计算的仪器 ... ...</dd>

<dd>以视觉方式显示信息的装置 ... ...</dd>

</dl>

</body>

</html>

3、显示结果：

欢迎分享，转载请注明来源：内存溢出

现在html里有两个dl怎么能让这两个dl在同一行内，而不是自动换行