题
如何在搜索框内实现搜索按钮,如Bing这样的网站上所示?
解决方案
它看起来像在内部,但不是(您不能将HTML放入输入中)。
这两个元素(输入和一个按钮)与0边距在一起,两者都具有相同的高度。该按钮的图形具有3PX白色边距。因此,它创造了这种效果。
可能的标记和样式可能是:
<input type="text" id="q" />
<input type="button" id="b" value="Search" />
#q, #b {
margin: 0
}
#q {
padding: 5px;
font-size: 2em;
line-height: 30px
}
#b {
/* image replacement */
text-indent: -99999px;
width: 30px;
height: 30px;
display: block;
background: gray url(button.png) 0 0 no-repeat;
/* placing next to input using float or absolute positioning omitted ... */
}
其他提示
不隶属于 StackOverflow