需要一个非常简单的HTML澄清

Question

我有以下代码

           <li>
                 <label> Label: </label>
                  <p>I am label 1 </p>
               </li>

这打印出像

 1.  Label:

    I am label 1

如何在打印时修改此内容

Label: I am label 1

Answer 1

<p>是block-level element所以您需要使用display:inline或inline-block（或float如果必须< / em>的）：

li p {display:inline-block;}

http://jsfiddle.net/AsY29/

Answer 2

<li>
    <label> Label: </label>
    <span>I am label 1 </span>
</li>

如果希望它显示在同一行中，请使用span而不是p。 p是block level element

Answer 3

       <li class="myli">
             <label class="mylabel"> Label: </label>
              <p class="inline-p">I am label 1 </p>
       </li>

CSS

.mylabel {display:inline-block;}
.inline-p {display:inline-block;}
li.myli {list-style-type:none;}

应该有效

Answer 4

li label, li p {
   float: left;
}

Answer 5

我想你开始使用<ul>或<ol>代码，而不是这样：

ul li p {
  display: inline;
}

或

ol li p {
  display: inline;
}

LIVE DEMO

Answer 6

标签仅在与<input>元素相关时才有意义。当用户点击<label>元素时，它指向的<input>会获得焦点并被选中。复选框被切换等等。

<li>
    <label for="quantity">Quantity</label>
    <input id="quantity" type="number"
           min="0" placeholder="Quantity (0 to delete)">
<li>

标签指向输入。使用CSS，您可以为form label提供宽度100px并将其浮动到左侧。您可以告诉form li向左清除。 form ol应该有list-style-type: none。这里不需要<p>。使用该系统;不要打它。

如果您只有纯文本，请使用纯文本，而不是标签。另一方面，您可能希望像旧<dl compact>中那样设置定义列表的样式。我不确定你是如何得到同一行的<dt>和<dd>的。