【问题标题】:How can I change the text boxes size in an entire division?如何更改整个分区中的文本框大小?
【发布时间】:2021-12-28 13:09:47
【问题描述】:

我正在尝试使盒子更小并且彼此相邻以形成整个部门的“盒子-盒子-盒子”形式,但是我不知道如何处理它。我知道如何通过单独编码每个文本来做到这一点,但是我想知道是否有更快的方法。任何帮助将不胜感激。

<div class="name">
  <label class="yyyy"></label>
  <input type="text" class="year" id="Project Name" placeholder="YYYY"> _
  <label class="sitee"></label>
  <input type="text" class="site" placeholder="Site" id="Project Name"> _
  <label class="GG"></label><input type="text" class="gg" id="Project Name" placeholder="GG"> _
  <label class="projectn"></label><input type="text" class="pn" id="Project Name" placeholder="Project Name"> _
  <label class="amountt"></label>
  <input type="text" class="amount" id="Project Name" placeholder="Amount"> _
  <label class=money></label>
  <input type="text" class="CCC" id="Project Name" placeholder="CCC">
</div>

【问题讨论】:

    标签: javascript html css text styles


    【解决方案1】:

    给它们一个宽度

    还可以将标签包裹在输入周围并删除空格,然后我们可以使用::before 在除最后一个之外的所有部分添加下划线

    .name input { width:45px }
    
    .name label+label::before { content: "_" }
    <div class="name">
      <label class="yyyy"><input type="text" class="year" id="Project Name" placeholder="YYYY"></label><label 
      class="sitee"><input type="text" class="site" placeholder="Site" id="Project Name"></label><label 
      class="GG"><input type="text" class="gg" id="Project Name" placeholder="GG"></label><label 
      class="projectn"><input type="text" class="pn" id="Project Name" placeholder="Project Name"></label><label 
      class="amountt"><input type="text" class="amount" id="Project Name" placeholder="Amount"></label><label 
      class=money><input type="text" class="CCC" id="Project Name" placeholder="CCC"></label>
    </div>

    【讨论】:

    • 现在可以使用了!谢谢你:)
    猜你喜欢
    • 2019-08-05
    • 1970-01-01
    • 2017-05-12
    • 1970-01-01
    • 2011-11-02
    • 2016-09-27
    • 2017-08-29
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多