Question

我想知道是否存在任何HTML标记来创建示例1中的列表而不是示例2：

enter image description here

这个ul / ol元素是否包含b标记？或者可能dl，dt和dd？如果这个问题太容易，我很抱歉，但我真的不知道。从技术上讲，根据W3规范，它也可以是figure元素，但这些都不会产生这种漂亮的缩进。这需要CSS吗？如果是这样，那是什么类型的CSS？

参考文献：

Answer 1

您发布的内容是定义列表（<dl>）的经典用法。这是另一种方法：

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">

<style media="all">
  dl, dt, dd {margin:0; padding: 0;}
  dl {width: 300px;}
  dt {float: left;}
  dd {overflow: hidden; padding-left: 14px; position: relative;}
  dd:before {content: "-"; position: absolute; top: 0; left: 4px;}
</style>

</head>
<body>
  <dl>
    <dt>code</dt>
    <dd>a system for communication by telegraph, heliograph etc., in which long and short sounds, light flashes etc. are used to symbolize the content of a message ...</dd>
  </dl>
</body>
</html>

Answer 2

也许像这样的css？

ul
{
  list-style-type:none;
  width:400px;
}

li
{
   float:left;
}

标记

<div>
<ul>
    <li>
        code - 
    </li>
    <li style="width:200px;text-align:justify;">
        adofjsdofioijdfoidjgdoigjgoidjgdofgjdfogidfjgoidfgjdfiogjdiogjdf
        dfgoijfdoigjdgoijgoigjoigjgoidjgoidfgjdfoiigjfdoigjfdgoidfjgoidfjgi
        dfgdgdjgodifgjdoigjogijgoigjfdoigdfgodfgoidfjgi
    </li>
</ul>    
</div>

http://jsfiddle.net/NB2Ep/12/

可能有更好的方法。我用简单的ul / li。

使用HTML创建单词定义

2 个答案: