Html 使用标签控件时定位标签

好的，尝试创建一个具有内联可填充表单的可填充表单（想想Mad Libs样式）

对于使用带标签控件并给定以下代码的元素：

Lorem ipsum（社区）和其他东西

---

是否可以仅使用CSS而不使用

for=“id name”

（在MDN中称为“标签控件”）将标签文本“（社区）”定位在输入行下方？只有真正的标签文本而不是其中的输入，选择器是什么？

而不是尝试移动文本，使输入块元素位于其下方

根据您的结构，我认为您希望使标签外的文本与输入保持一致。为此，请使标签

显示：inline block

，以获得所需的高度。然后您可以将

p

的文本与顶部对齐，以便所有文本对齐

我在这方面使用的css是：

label input {
  display:block;
}
label {
  display: inline-block;
}

p * {
  vertical-align: top;
}

要选择不是输入的标签内容，可以使用

：not

选择器。因此，要设置文本样式，可以使用：

label *:not(input)

这将选择标签中不是输入元素的所有内容