Question

我要做成这样的搜索框效果，求教怎么用div+css怎么写出来，谢谢！

我要做成这样的搜索框，求教做网页设计或网站开发的朋友们，怎样写CSS实现?谢谢？如图：

Answer 1

首先是切图，小三角和搜索那个按钮，这是第一步；
然后是写代码：这个盒子可以分为三段
<div class="search_box">//这个盒子设置搜索框的宽度高度和position:relative;位置自适应，以及border：2px solid #a3a3a3;

<div class="search_class">//这个盒子乘放的是news这一块儿设置宽高，文字浮动居中；vertical-align:middle;

News和小三角图片

</div>

<input type="text" class="search_inp">//这个就设置宽高就好了

<input type="button" class="search_btn">//这个设置背景图片为搜索那个按钮，位置显示不正确的话，加上这句代码（position:absolute;right:0;）

</div>
以上代码只是大概，应该可以解决该问题！望采纳~有问题可以百度hi我！

Answer 2

做成图片，以背景的形式加入css中，border:0px;就行了。
又或都border:2px solid #a3a3a3; news和search应该就不用我说了吧！！！

Answer 3

用一个table，把下拉列表框和文本框还有按钮放入单元格。input样式border：none；按钮应该会写吧，type=“image”，不要用button或者submit。

Answer 4

求图。

追问

就是上面的效果图呀，你看不到吗？