Question

如何更改＆＃34;文件输入按钮的颜色＆＃34;？

这就是我所拥有的：

<div class="form-group">
        <label for="exampleInputFile">File input</label>
        <input type="file" id="exampleInputFile">
        <p class="help-block">Example block-level help text here.</p>
</div>

我尝试了下面的代码，但没有任何反应：

#input[type=file]{
    background: #000;
}
input{
    background: #000;
}

如何更改输入文件类型的颜色？

Answer 1

使用它可以帮助你

<div class="form-group">
        <div class="fileUpload btn btn-primary">
        <span>File input</span>
        <input type="file" id="exampleInputFile" class="upload">
        </div>
        <p class="help-block">Example block-level help text here.</p>
</div>

并且风格

<style>
.fileUpload {
    position: relative;
    overflow: hidden;
    margin: 10px;
}
.fileUpload input.upload {
    position: absolute;
    top: 0;
    right: 0;
    margin: 0;
    padding: 0;
    font-size: 20px;
    cursor: pointer;
    opacity: 0;
    filter: alpha(opacity=0);
}
</style>

Answer 2

你可以这样试试，

<style type="text/css">
.file-input{
    display:none;
}
.file-lablel{
    background: #d5d5d5;
    border-radius: 5px;
    padding: 5px;
}

<div class="form-group">
    <input type="file" id="exampleInputFile" class="file-input">
    <label for="exampleInputFile" class="file-lablel">File input</label>
    <p class="help-block">Example block-level help text here.</p>
</div>

Answer 3

选择器和属性似乎是正确的，只要它在HTML中的HEAD元素内：

#input[type=file] {
   background-color: #F00;
}

检查您是否需要background属性或background-color:属性

我如何在bootstrap css文件中更改文件输入的背景？

3 个答案: