如何在html / css中实现MS word标签功能？

alexwong820

现在，我正在编写一个html文件，该文件只想复制MS Word文件外观以进行进一步的编程。但是，如何实现以下图像？这个

在此阶段，我不能使两个冒号处于同一位置，因为我仅使用下划线。感谢您的帮助。

现在我只能做到这一点。通过此代码：

.box{float:left; margin-right:10px;}
input{border:0;border-bottom:1px solid #000;  background: transparent;
  outline: none;}

<div>
  <div class="box">
      <lable style="display:inline-block; min-width:50px;">Applicant’s signature</lable>
<span>:</span>
    <input type="text">
    </div>
  <div class="box">
      <lable style="display:inline-block; min-width:50px;">Date</lable>
<span>:</span>
    <input type="text">
    </div>
  <div class="box">
      <lable style="display:inline-block; min-width:50px;">Applicant’s name</lable>
<span>:</span>
    <input type="text">
    </div>

</div>

谢谢你的帮助！

拉吉·塔达尼（Lalji Tadhani）

.box{float:left; margin-right:10px;}
lable{display:inline-block; min-width:50px;}
input{border:0;border-bottom:1px solid #000;}

<div>
  <div class="box">
      <lable>Date</lable>
<span>:</span>
    <input type="text">
    </div>
  <div class="box">
      <lable>Name</lable>
<span>:</span>
    <input type="text">
    </div>
  <div class="box">
      <lable>Name</lable>
<span>:</span>
    <input type="text">
    </div>
  <div class="box">
      <lable>Name</lable>
<span>:</span>
    <input type="text">
    </div>
</div>

本文收集自互联网，转载请注明来源。

如有侵权，请联系 [email protected] 删除。