【问题标题】:styling a input type="file" [duplicate]设置输入类型 =“文件” [重复]
【发布时间】:2013-05-09 12:06:00
【问题描述】:

我正在尝试对齐文本,使其具有与选择文件按钮相同的填充。

input[type='file'] {
    background: #000;
    border-radius: 5px;
    color: #fff;
    font-family: "Marmellata", sans-serif;
    padding: 6px 10px 14px 17px;
    font-size: 20px;
    margin-bottom: 20px;
    width: 240px;
    vertical-align: top;
    margin-top: 0px;
}
<input name="t1" class="imgupload" type="file" accept="image/*" capture="camera">

编辑:

我已经用这个方法解决了这个问题:

.select-image-btn input[type=file] {
        font-size: 100px;
        position: absolute;
        left: 0;
        top: 0;
        opacity: 0;
        }

.select-image-btn {
        position: relative;
        overflow: hidden;
        display: inline-block;
        }

只需添加类名

输入[类型=文件]

div应该是这样的

<div class="select-image-btn">
      <button class="btn default" >Upload a file</button>
      <input type="file" name="t1" accept="image/*" capture="camera">
</div>

【问题讨论】:

    标签: css


    【解决方案1】:

    你为什么不使用下面的?

    input.imgupload {
    background: #000;
    border-radius: 5px;
    color: #fff;
    font-family: "Marmellata", sans-serif;
    padding: 6px 10px 14px 17px;
    font-size: 20px;
    margin-bottom: 20px;
    width: 240px
    vertical-align: top;
    margin-top: 0px;
    }
    

    无论如何,类的权重都比属性选择器强。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2021-10-24
      • 1970-01-01
      • 2010-11-04
      • 2018-01-14
      • 1970-01-01
      • 2010-12-04
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多