HTML 中的 Likert 量表

Question

我正在尝试在 HTML 中查找李克特量表的代码。我有三个问题：

1. 我想说 - 左边没有罪，非常有罪

2. 我想说 - 左边有很多伤害，右边没有伤害

3. 我想说 - 左边不确定，右边非常确定。

   有谁知道如何编码？

Answer 1

这是比尔答案的简化版本。li如果你把它放在整体上，你不需要对每个人进行分类ul。我绝对同意这不是 table 元素的适当或语义使用。这是一个答案列表。

.likert li {
  float: left;
  list-style-type: none;
}

<ul class="likert">
  <li> Not Guilty </li>
  <li><input type="radio" name="guilty" value="1" /></li>
  <li><input type="radio" name="guilty" value="2" /></li>
  <li><input type="radio" name="guilty" value="3" /></li>
  <li><input type="radio" name="guilty" value="4" /></li>
  <li><input type="radio" name="guilty" value="5" /></li>
  <li> Very Guilty </li>
</ul>

小提琴演示

截图：