css - 使输入字段透明

Question

我想采用标准输入字段并使其看起来更好。因此，我将这张图片用作我页面上的输入字段:

要在我的页面上使用它，我使用以下代码:

HTML:

<input type="text" class="inputstyle" />

CSS

.inputstyle {
padding:7px 10px 5px 10px;
width:251px;
height: 38px;
background: url('images/form_smaller.png') no-repeat 0 center;
border:0;
font-size:14px;
}

当输入字段在白色背景上时，这不是问题。但我的输入字段是浅绿色背景，它使输入字段看起来像这样:

我的问题是:如何去除原始输入字段的 Angular 以使其看起来更漂亮？

Answer 1

要回答您的实际问题，您只需将图像设为透明的 gif 或 png。 Photoshop 可以轻松做到这一点，只需删除背景层，确保您的输入有背景，然后使用文件保存 > 为网络和设备保存。

但是，我不建议将输入替换为背景图像。一个简单的 border-radius 就可以在所有现代浏览器上完成这项工作。