我有一个如下所示的搜索框,我正在使用 bootstrap 来提供灵活的布局。如何使用如下设计并确保我可以获得可伸缩的搜索框。
最佳答案
您需要一个容器来放入您的输入框,并在其中放置前端和后端 div。根据浏览器的兼容性,您可能需要添加更多的 div 以确保您的输入框在 IEX7/8 等浏览器中正确显示。
所以你会有以下内容:
<form class="searchbox">
<input type="text" class="text" />
<input type="submit" class="submit" />
</form>
伴随着下面的例子CSS
form.searchbox { background:url(leftside_image.gif) 0 0 no-repeat; padding-left:15px; }
form.searchbox input.text { border:none; border-top:1px solid #999; border-bottom:1px solid #999; height:25px; line-height:25px; padding:0 5px; }
form.searchbox input.submit { background:url(rightside_image.gif); }
关于html - 带有背景图形的搜索栏,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16769671/