Question

我希望在每次toSingle()控件后都有换行符（<br>）。我如何在CSS中做到这一点？

我必须添加：我希望输入控件在同一行上开始，作为标签或其前面的任何内容，但在其末尾有一个换行符，以便后面的任何内容都单独启动线。

我知道这与Flex盒子模型有关，但我还不太熟悉。

＆＃13;

input

＆＃13;

label {
  font-weight: bold;
}

input {
  display: / * what goes here? */
}

＆＃13;

Answer 1

在标签上使用伪元素强制换行

label::before {
  content: "\A"; /* U+000A is the newline sequence */
  display: block;
}

Codepen demo

这会将标签放在一个新行上，但它会将输入保持在前一个标签的同一行。您还可以通过在伪元素

上设置height来控制行之间的间距

Answer 2

如果您不能/不会更改带有输入的标记集display:block和带标签的float:left。

label {
  font-weight: bold;
  float: left;
  margin-right: 10px;
}

input {
  display: block;
}

<label for="theButton">Button</label>
<input name="theButton" type="button" value="Click me">
<label for="theTextBox">Button</label>
<input name="theTextBox" type="text">

顺便说一下，最好考虑调整HTML并使用更优雅的方式。

如何使HTML元素从同一行开始，但以换行符结束？

2 个答案: