CSS AjaxControlToolkit,ComboBox 风格
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/1691630/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
AjaxControlToolkit, ComboBox style
提问by Fabio
I am with a little problem with the arrow image of a ComboBox control (AjaxControlToolkit).
我对 ComboBox 控件 (AjaxControlToolkit) 的箭头图像有一点问题。
I define this style:
我定义了这种风格:
.WindowsStyle .ajax__combobox_inputcontainer .ajax__combobox_buttoncontainer button
{
margin: 0;
padding: 0;
background-image: url(../icons/windows-arrow.gif);
background-position: top left;
border: 0px none;
height: 21px;
width: 21px;
}
I set this style on combobox, but the control are showing the border of the textbox before the arrow:
我在组合框上设置了这种样式,但是控件在箭头之前显示了文本框的边框:
Look here, the border aren't showing!
看这里,边框没有显示!
How can I hide this border?
如何隐藏此边框?
回答by David Hall
This is working fine for me, I have the following css in my page head (though it can go anywhere else like in a stylesheet of course)
这对我来说很好用,我的页面头部有以下 css(尽管它当然可以放在样式表中的任何其他地方)
<style type="text/css">
.WindowsStyle .ajax__combobox_inputcontainer .ajax__combobox_textboxcontainer input
{
margin: 0;
border: solid 1px #7F9DB9;
border-right: 0px none;
padding: 1px 0px 0px 5px;
font-size: 13px;
height: 18px;
position: relative;
}
.WindowsStyle .ajax__combobox_inputcontainer .ajax__combobox_buttoncontainer button
{
margin: 0;
padding: 0;
background-image: url(windows-arrow.gif);
background-position: top left;
border: 0px none;
height: 21px;
width: 21px;
}
.WindowsStyle .ajax__combobox_itemlist
{
border-color: #7F9DB9;
}
</style>
And then I have this control markup in the body of my page:
然后我在我的页面正文中有这个控件标记:
<ajaxToolkit:ComboBox ID="ComboBox1" runat="server" CssClass="WindowsStyle">
<asp:ListItem Text="[Select an item]" Value="" />
<asp:ListItem Text="Actual Item #1" Value="SomeValue" />
<asp:ListItem Text="Actual Item #2" Value="3" />
<asp:ListItem Text="Actual Item #3" Value="xxx" />
</ajaxToolkit:ComboBox>
Perhaps you have some conflicting styling? Have you tried a simple page with nothing but what you require to generate the combobox?
也许你有一些相互冲突的风格?您是否尝试过一个简单的页面,除了生成组合框所需的内容之外什么都没有?