以格式

时间:2018-06-19 18:17:05

标签: html css

那是我的代码

    <form class="contactForm">
        <label> Your name
          <input type="text" name="name" placeholder="Your name">
        </label>
      </form>

我希望输入元素显示在标签元素下方。以为它是一个块元素的问题,但是当我在css输入或标签中显示为块样式时,什么也没有发生。感谢您的帮助

6 个答案:

答案 0 :(得分:1)

设置了<span>的{​​{1}}应该可以解决问题-与使用display: block不同,它是有效的HTML。只要确保父标签仍未设置为<div>-这是默认设置即可。

示例:

display: inline
label,
label > span {
  display: block;
}

答案 1 :(得分:0)

<br />的作品吗?

    <form class="contactForm">
        <label> Your name
          <br />
          <input type="text" name="name" placeholder="Your name">
        </label>
      </form>

答案 2 :(得分:0)

虽然可以通过这种方式设置标签,但请尝试使其成为输入的同级而不是父级。另外,为其赋予for属性以匹配输入的name属性。

<form class="contactForm">
        <label for="name">Your name</label>
        <input type="text" style="display:block" name="name" placeholder="Your name">
</form>

这样使用标签后,您可以看到display:block可以正常工作。只是想补充:在最终解决方案中,直接使用style标签是不明智的做法,我建议创建易于理解的CSS类。

希望有帮助。

答案 3 :(得分:0)

position()

答案 4 :(得分:0)

标签中的文本没有标签。如果添加let task = Task(content: "Foo", deadline: Date(), color: .orange) do { let data = try JSONEncoder().encode(task) print(String(data: data, encoding: .utf8)!) let newTask = try JSONDecoder().decode(Task.self, from: data) print(newTask) } catch { print(error) } ,则可以为其添加一些样式。

<span>
label span{
  display: block;
}

答案 5 :(得分:0)

您只需要使用div

中的输入字段

<form class="contactForm">
        <label> Your name </label>
        <div>
          <input type="text" name="name" placeholder="Your name">
        </div>
      </form>