css – 内联显示定义术语和描述

注意：您必须避免DD元素之间的空格才能正常工作.

IE8不需要黑客攻击：

dd,dt{
    display: inline;
    margin: 0;
}
dd:before {
    content: ' '; /* space them */
}
dt:before { /* insert line break before <dt> */
    content:"\A";
    white-space:pre;
}
dt:first-child:before { /* disable line break before the first <dt> */
    content: none;
}

如果您不需要支持IE8,请跳过第4个CSS规则并将此选择器用于第3个：dt：not(：first-child)：before

结果应该是这样的：(demo)

DT DD DD
DT DD DD

如果你想要真正酷,你可以用这个替换第二个规则：

dd + dd:before {
    content: ','; /* add comma between definitions */
}

dt:after {
    content: ':';
}

结果应该是这样的：(demo)

DT: DD,DD
DT: DD,DD