Html 在自动生成的标签标记中居中显示文本

我从CMS中获得以下html片段：

<label title="">
    Land
    <input id="Land" name="Land" size="20" type="text" value="">
    <span class="field-validation-valid" data-valmsg-for="Land" data-valmsg-replace="true"></span>
</label>

土地

我需要将文本

Land

居中放置，但我似乎无法找到它。我试过在标签上设置

text align:center

，但不起作用。我无法修改标记。是不是我错过了一些简单的东西

编辑： 我想把它集中在这个输入上：

---

不要介意输入字段的右边缘。标签的宽度为输入字段宽度的100%。

标签是一个内联元素，因此其内容的宽度完全相同

你需要一个div或者别的什么来做这件事

---

在不改变标记本身的情况下这样做充其量是混乱的，可能会包含一些javascript/jquery

标签没有扩展到100%宽度，因为它是一个内联元素。要在标签css上启用此设置，请执行以下操作：

label {
    display: block;
    text-align: center;
}

或者将文本直接插入块元素，如：div等。

编辑： 只需添加以下CSS即可获得所需结果：

label input, label span {
    display: block;
}

观看现场演示：或

---

用div元素将代码段括起来，并在div上应用text align属性

HTML:

---

尽管我不愿意推荐使用

标记，但考虑到您当前的结构，这里是一种方法

HTML

<label title="">
    Land
    <br/>
    <input id="Land" name="Land" size="20" type="text" value=""/>
    <span class="field-validation-valid" data-valmsg-for="Land" data-valmsg-replace="true"></span>
</label>

---

有两种方法可以解决这个问题

1.display属性指定元素是否显示/如何显示，因此标签必须显示为块或内联块以使其居中

label {
  display: inline-block;
  text-align: center;
}

2.您可以使用html标记中心

<center>
  <label title=""> 
     Land
     <input id="Land" name="Land" size="20" type="text" value="">
     <span class="field-validation-valid" data-valmsg-for="Land" data-valmsg-  replace="true"></span>
  </label>
</center>

土地

如果你想把单词Land放在居中的标签上，你可以加上这个

<center>Land</center>

土地

你是什么意思？把它放在哪里？啊，对不起，更新了问题。@KheemaPandey-这个问题之前的框架不同，我的答案是针对那个版本的。我已经更新了答案以反映问题中的变化。使用了第一个建议。

label {
  display: inline-block;
  text-align: center;
}

<center>
  <label title=""> 
     Land
     <input id="Land" name="Land" size="20" type="text" value="">
     <span class="field-validation-valid" data-valmsg-for="Land" data-valmsg-  replace="true"></span>
  </label>
</center>

<center>Land</center>