Question

我不是CSS的专家，所以请原谅我可能使用的错误字词。

我有以下css文件，我通常在.NET上的webforms中使用 styles.css的

然后，其中一个方法是：

.tbox
{
    border-right: #728d8d 1px solid;
    border-top: #728d8d 1px solid;
    font-size: 13px;
    border-left: #728d8d 1px solid;
    border-bottom: #728d8d 1px solid;
    font-family: Verdana;
    background: url(images/boxBorders/formshdw.gif) no-repeat -4px -4px #fff;
}

我通常用于文本框。现在，问题在于每当我禁用文本框时，它都会保留相同的属性（不会变为灰色以让用户知道文本框被禁用的外观）。我开始寻找解决方案，我唯一想到的是：

input[disabled='disabled'] 
{
  /* Your CSS Styles */
  background-color:#F0F0F0 !important; 
  color:#303030 !important;
}

input[readonly]
{
  /* Your CSS Styles */
  background-color:#F0F0F0 !important; 
  color:#303030 !important;
}

但是，我相信这些会添加到我要使用的每个表单中。有没有办法让.tbox可以继承这些属性？如果两个作品中只有一个无关紧要，只要我可以阻止用户输入和切换文本框颜色，我很高兴。

此致

Answer 1

如果您想将这些样式应用于仅具有.tbox类的元素，请执行以下操作：

.tbox input[disabled='disabled'] 
{
  /* Your CSS Styles */
  background-color:#F0F0F0 !important; 
  color:#303030 !important;
}

.tbox input[readonly]
{
  /* Your CSS Styles */
  background-color:#F0F0F0 !important; 
  color:#303030 !important;
}

这是CSS的级联部分：）

Answer 2

您应该为每个行为创建separte类：

.tbox-disabled 
{
  background-color:black !important; 
  color:white !important;
}

.tbox-readonly
{
  background-color:black !important; 
  color:yellow !important;
}

然后在您的对象中，您必须设置适当的CSS类名和行为：

只读： CssClass =＆＃34; tbox-readonly＆＃34; AND ReadOnly =＆＃34; true＆＃34;

<asp:TextBox ID="tbxInvoiceExtNumber" 
             runat="server" 
             CssClass="tbox-readonly" 
             Width="50px" 
             ReadOnly="true">
</asp:TextBox>

已停用： CssClass =＆＃34; tbox已停用＆＃34; AND 已启用=＆＃34; false＆＃34; < / p>

<asp:TextBox ID="tbxInvoiceExtNumber" 
             runat="server" 
             CssClass="tbox-disabled" 
             Width="50px" 
             Enabled="false">
</asp:TextBox>

您还可以通过编程方式应用CSS和行为：

tbxInvoiceExtNumber.CssClass="tbox-disabled";
tbxInvoiceExtNumber.Enabled="false";

如何在css文件中添加文本框的禁用属性？

2 个答案: