html - 更改输入框：带有 CSS/HTML 的输入区域

Question

所以，我有一个框，我想用作我的搜索框/输入框。虽然当我在上面打字时，我可以在整个图像上打字。

我想要做的是只能输入图像的空白区域？我会添加填充吗？

这是我的 CSS：

input.searchbox {
background-color: #fff;
background:url(search.png) no-repeat;
width:250px;
height:41px;
border:none;
font-size:20px;
}

这是我的 HTML：

<input type="text" class="searchbox" size="20" value="{Q}">

另外，我将如何更改框中的文本大小？

score 1 · Accepted Answer

您的图像是背景图像。因此，如有必要，文本将覆盖它。

尝试放置一个单独的图像，并在该图像和文本之间留出一些边距。

score 0 · Accepted Answer

根据您的图像（文本位置，文本是什么），我使用表格来保存输入（带有图像），然后在单独的列中具有旁边带有匹配图像的提交按钮。

恕我直言，这实际上取决于您使用的图像以及您如何尝试将其与输入字段匹配。

2 回答 2