gpt4 book ai didi

html - 尝试在文件字段内设置浏览按钮的样式

转载 作者:行者123 更新时间:2023-11-28 11:25:23 25 4
gpt4 key购买 nike

我看过一些类似的堆栈溢出问题,但都没有帮助。我有一个如下所示的文件字段:

File field

我正在尝试将浏览按钮的位置移动到左侧,使其与文本字段对齐,并为其添加边框半径,使其与周围的文本字段匹配。我不知道该怎么做。这是文件字段的 html:

<input class="field file-field" type="file" multiple="multiple"></input>

这是CSS:

.field {  
float:left;
display:inline;
width:150px;
height:28px;padding:0 5px;
border-radius: 5px;
border: solid 1px #bfbfbf;
background: url(/assets/field30.png);
color:#575757;
font-size:13px;
margin: 0 10px 0 40px;
font-family: 'Roboto', sans-serif;
font-weight:300;
}

.file-field {
width:500px;
border-radius: 25px;
}

最佳答案

不完全清楚你在问什么,因为我们看不到你试图对齐什么,但是如果你从字段中删除高度设置并且可能在周围使用填充你会得到更好的结果:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<style media="all">

.field {
width:150px;
padding:5px;
border-radius: 5px;
border: solid 1px #bfbfbf;
background: url(/assets/field30.png);
color:#575757;
font-size:13px;
margin: 0 10px 0 40px;
font-family: 'Roboto', sans-serif;
font-weight:300;
}

.file-field {
width:500px;
border-radius: 25px;
}

</style>
</head>
<body>

<form action="">
<input class="field file-field" type="file" multiple="multiple"></input>
</form>

</body>
</html>

关于html - 尝试在文件字段内设置浏览按钮的样式,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21370753/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com