HTML：无法调整 <label> 标签内的 svg 图像

Question

我有一个使用文件输入字段的 html

<input name="fileinput" type="field">

通过使用标签标记，外观被自己的文本覆盖。现在我想使用 svg 图像而不是普通文本

        <input type='file' name="fileinput" id="fileinput" style="display:none">
        <label for="fileinput" style="border: 1px solid red;">
            <svg id="imp" width="25px" height="25px" viewBox="0 0 59 30" style="margin-left: calc(50% - 0.5em)">
                <g transform="scale(0.03125 0.03125)">
                    <path d="M576 256l-128-128h-448v832h1024v-704h-448zM512 480l224 224h-160v256h-128v-256h-160l224-224z"></path>
                </g>
            </svg>
        </label><br>
        <button type="button" id="export" onClick="export()">
        <svg alt="Export" width="25px" height="25px" viewBox="0 0 59 30" style="margin-left: calc(50% - 0.5em)"><g transform="scale(0.03125 0.03125)"><path d="M576 256l-128-128h-448v832h1024v-704h-448zM512 864l-224-224h160v-256h128v256h160l-224 224z"></path></g></svg>
        </button>

我无法设置标签样式，因此它看起来像一个按钮。有办法实现这个目标吗？我可以将图像转换为其他格式吗？

提前致谢

Answer 1

为

label

提供

display

属性，例如

inline-block

并添加您可能需要的任何其他样式。

label {
  display: inline-block;
  padding: 0 .5em;
  background: lightgrey;
  margin-bottom: .25em;
}

<input type='file' name="fileinput" id="fileinput" style="display:none">
<label for="fileinput" style="border: 1px solid red;">
            <svg id="imp" width="25px" height="25px" viewBox="0 0 59 30" style="margin-left: calc(50% - 0.5em)">
                <g transform="scale(0.03125 0.03125)">
                    <path d="M576 256l-128-128h-448v832h1024v-704h-448zM512 480l224 224h-160v256h-128v-256h-160l224-224z"></path>
                </g>
            </svg>
        </label><br>
<button type="button" id="export" onClick="export()">
        <svg alt="Export" width="25px" height="25px" viewBox="0 0 59 30" style="margin-left: calc(50% - 0.5em)"><g transform="scale(0.03125 0.03125)"><path d="M576 256l-128-128h-448v832h1024v-704h-448zM512 864l-224-224h160v-256h128v256h160l-224 224z"></path></g></svg>
        </button>