Blazor 中的自定义输入文件

Question

我想用“附加图标”替换输入文件的矩形。我尝试将图标的 URL 设置为 InputFile 的“背景图像”，但没有效果。 这仅演示了如何更改 InputFile 的颜色，并不完全是我所需要的。

Answer 1

我使用类似的颜色选择器。

<label for="fileinput" class="label-wrapper">
    <span class="oi oi-paperclip"></span>
    <InputFile id="fileinput" class="custom-input-hide" />
</label>

<style>
    .label-wrapper:hover {
        cursor: pointer;
    }

    .custom-input-hide {
        width: 0;
        height: 0;
        overflow: hidden;
    }
</style>

Blazor复制品