2010-05-03 75 views
1

我正在尝试做一个搜索栏,眼下代码如下:制作一个流畅的视觉流畅搜索栏,ASP.NET C#

 <asp:DropDownList ID="DropDownList1" runat="server" Height="25px"> 
      <asp:ListItem>Database</asp:ListItem> 
      <asp:ListItem>Engine</asp:ListItem> 
      <asp:ListItem>Pool</asp:ListItem> 
     </asp:DropDownList> 
     <asp:Button ID="Button1" runat="server" Text="Button" Height="25px" /> 
     <asp:TextBox ID="TextBox1" runat="server" Height="25px"></asp:TextBox> 
     <asp:LinkButton ID="LinkButton1" runat="server">LinkButton</asp:LinkButton> 

现在它看起来像废话和犯规流量可言,我不知道我怎么会去做出更好的视觉寻找搜索栏与所有需要的精密组件。谢谢。

例如:digg.com在那里有图片搜索栏。

编辑:基本上,我想这个图像代码:http://o.imm.io/qlQ.png

+0

护理定义您通过“流动”打算什么?视觉?可用性?什么? – Aren 2010-05-03 19:54:40

+0

编辑的问题,但我视觉。 – 2010-05-03 20:02:16

回答

1

我学到的最大教训是,如果你有一个小的空间量和用户有一些选项可供选择(和理解)唐不使用标准的HTML控件。设计一个反对使用恼人的HTML元素的真正解决方案。

构建搜索区域的一个主要问题是下拉列表不是非常适合样式。尝试建立他们可以选择的选项。您只有三个选项可以从单选按钮列表中选择,因为用户会看到所有选项。然后,您可以将过滤器应用到列表中,并使其成为基于图像的切换选项列表。

看到这里的第一个例子中的其他选项(接口元素点播): http://www.smashingmagazine.com/2009/01/12/10-useful-web-application-interface-techniques/

alt text http://media.smashingmagazine.com/cdn_smash/images/web-applications-interface-techniques/kontain_search.png