html - 列表统一对齐

Question

如何在 html/css 中创建一个显示如下数据的列表:

who:   him
where: there
what:  that
why:   because

即使它不是等宽字体，它的答案也具有一致的水平对齐方式？

Answer 1

如果您使用“li”，请像这样在 css 中创建两个类:

.question{
    clear:right;
    width: 50px;
}
.answer{
   float:left;
}

当然还有:

li{
    display:inline-block;
}

可能很清楚:左；不确定都尝试一下。

然后将 class="question"应用于问题，将 class="answer"应用于答案。

您可能还想添加:

margin:0;padding:0;list-decoration:none;