ASP.NET 文本框，在外部 CSS 文件中设置焦点边框颜色答案

【问题标题】：ASP.NET text box, set focus border color in external CSS fileASP.NET 文本框，在外部 CSS 文件中设置焦点边框颜色
【发布时间】：2012-10-22 08:43:23
【问题描述】：

我有一个 ASP.NET 文本框。当文本框获得焦点时，我试图将边框的颜色设置为绿色，并且我想具体说明文本框的 class。文本框看起来像这样 -

<asp:TextBox CssClass="myInput" BorderStyle="None"  runat="server">Search</asp:TextBox>

注意：我从 BorderStyle="None" 开始，因为当文本框没有焦点时，我希望 no 显示边框。目前对焦时显示边框，但不是我想要的颜色。

我在我的 CSS 文件中尝试了以下内容 -

.myInput:focus {
                 border: green;
              }

和

input.myInput:focus {

                    border: green;
                }

（和其他一些）但没有任何效果。有人可以告诉我怎么做吗？谢谢！

【问题讨论】：

标签： asp.net css

【解决方案1】：

你可以这样使用

<asp:TextBox ID="txtSearch" CSSClass="myInput" runat="server">Search</asp:TextBox>

【讨论】：

【解决方案2】：

我不得不使用 -

 .myInput:focus {
        border:solid 1px green !important;
 }

因为边框样式被其他 CSS 设置覆盖。

【讨论】：

【解决方案3】：

看看this

你需要使用border: 1px solid green;而不是border: green

你的文本框应该是这样的

<asp:TextBox CssClass="myInput"  runat="server">Search</asp:TextBox>

更新

我认为使用 jQuery 会更好。

您可以在焦点上添加一个类，并在失去焦点时删除该类

查看更多关于focus和focusOut的信息

看到这个sample

【讨论】：

【解决方案4】：

是的，您需要从您的 TextBox 控件中删除 BorderStyle="None"。

在 CSS 中为此设置border 样式，然后您可以使用focus

您一开始看不到文本框 - 点击您看到“文本框 ->”的右侧

【讨论】：