search - 维基百科是如何建立它的搜索领域的？

Question

我想知道维基百科是如何做它的搜索字段的。我的意思是两件事：它的渐变和它的按钮。

它是如何在现场产生渐变的？这可以通过 CSS 跨浏览器轻松完成，但是当您执行 IE CSS 代码时，它会为文本设置别名。维基百科有渐变背景，但文字仍然是抗锯齿的！他们是怎么做到的？

另外，他们是如何在文本字段中放置一个可点击的搜索按钮的？

谢谢。

Answer 1

你可以看看代码。出现的搜索框只是一个带边框的 div 元素。这个 div 本身通过 CSS（背景图像）设置了渐变。如您所见，按钮元素也不在文本字段内。

<div id="simpleSearch">
    <input id="searchInput" name="search" type="text"  title="Search Wikipedia [f]" accesskey="f"  value="" />
    <button id="searchButton" type='submit' name='button'  title=""><img src="[x]" alt="Filltext" /></button>
</div>

Answer 2

实际的搜索输入似乎没有样式——这意味着没有边框和透明背景。包含 div 的样式看起来像一个输入字段（边框和渐变）。可点击按钮位于 div 内，但不在实际输入元素内。