css中的标题标记会创建新行

Question

我正在尝试使用它前面的文本制作一些输入框，但每次我在CSS中设置文本样式时，样式会强制我的输入框“到一个新行”。在图像中，前两个文本部分没有样式，接下来的4个是。我希望我的样式文本不要创建新行。

图片：http://puu.sh/8kPKl.png

html部分：

<h0>Fulde navn:</h5> <input type="text" name="name"><br>
<h0>E-mail:</h5> <input type="text" name="email"><br>
<h5>Telefon nr:</h5> <input type="text" name="tlf"><br>
<h5>Antal personer:</h5> <input type="text" name="pers"><br>
<h5>Flytype:</h5> <input type="text" name="type"><br>
<h5>Betalingsform:</h5> <input type="text" name="betal"><br>

CSS部分：

#four h5 {
    font-size: 20px;
    color: #ffffff;
}

Answer 1

默认情况下，标题元素是块级元素。尝试添加display:inline

#four h5 {
    font-size: 20px;
    color: #ffffff;
    display: inline;
}

inline-block也适用。

小提琴：http://jsfiddle.net/5SEre/

Answer 2

这里有三件事：

1。你的前两个标题是<h0>的

让他们成为<h5>的

2。 <h5>以下的额外空间是边距：

#four h5{
    margin: 0;
}

3。块元素

正如@DrydenLong中his answer所指出的，标题是块元素，因此它们会自动在自己的行上呈现。您可以通过将它们设置为内联或内联块元素来解决此问题：

#four h5{
    display: inline;
    //or
    display: inline-block;
}