时间戳

首页 > 解决方案 > 文件输入占位符

html - 文件输入占位符

问题描述

我想用“cv”代替“没有选择文件”，我试图在文件输入上添加占位符，但它不起作用

在此处输入图像描述

        <div class="col-md-6 form-group ">

          <input type="file" class="col form-control text-field-box mt-3" name="cv" id="files" placeholder="CV" accept="application/pdf" required />
          <label class="ml-3 " 
          style="font-size: 13px;position: absolute;top: 0px;
          font-family: 'Roboto', sans-serif;font-weight: 300;">CV</label>

        </div>

标签： htmlcssbootstrap-4

解决方案

请仔细检查我的代码，如果您对此有任何疑问，请告诉我。:)

希望它会帮助你。

.file-wrapper .col.form-control{
height: 20px;
background: transparent;
border: 0;
position: absolute;
left: 0;
opacity: 0;
top: 0;
bottom: 0;
width: 100%;
z-index: 1;
}

.file-wrapper .ml-3{
font-size: 13px;
position: relative;
top: 0px;
font-family: 'Roboto', sans-serif;
font-weight: 300;
z-index: 0;
}
<div class="col-md-6 form-group file-wrapper">

    <input type="file" class="col form-control text-field-box mt-3" name="cv" id="files" placeholder="CV" accept="application/pdf" required />
    <label class="ml-3 " 
    style="font-size: 13px;position: absolute;top: 0px;
    font-family: 'Roboto', sans-serif;font-weight: 300;">CV</label>

  </div>

推荐阅读