如何在标签前添加文本信息

时间:2015-03-23 18:47:43

标签: html label

我有这个:

http://jsfiddle.net/mlotfi/n9r8g95h/

<label class="formLabel">Left Hand Side </label> 
   <input type="text" name="lhsKey" size="65" value="" id="lhsKey">
   <br /> 
<label class="formLabel">Right Hand Side</label> 
   <input type="text" name="rhsValue" size="65" value="" id="rhsValue">
   <br /> 

我想在两个标签前添加一些文字信息,以便:

http://s1.postimg.org/90q588gan/label.png

1 个答案:

答案 0 :(得分:0)

也许使用span

<强> HTML:

<label class="formLabel">Left Hand Side <span class="text-info">('xnc.path.' will be automatically prefixed)</span></label>
<input type="text" name="lhsKey" size="65" value="" id="lhsKey"><br /> 
<label class="formLabel">Right Hand Side <span class="text-info">('/ent/ic' will be automatically prefixed)</span></label> 
<input type="text" name="rhsValue" size="65" value="" id="rhsValue"><br /> 

<强> CSS:

label { 
    font-weight: bold; font-size: 100%; text-transform: uppercase; letter-spacing: .125em;
}
.formLabel {
     display: block; line-height: 1.8; vertical-align: top; font-weight: bold; padding-top: 10px;   color: #245393; 
}

.text-info {
    text-transform: none;
    color: purple;
}

http://jsfiddle.net/n9r8g95h/4/