ASP.NET GridView CSS在打开排序时出现问题

问题描述：

我在ASP.NET应用程序中创建了一个GridView，并使用自动格式工具来应用有吸引力的风格。现在我将样式标记移动到CSS表单中，并且出现一个奇怪的问题，其中标题行中的文本不是正确的颜色（它应该是白色的，但显示为明亮的蓝色）。 只有当我开始排序时，才会显示此问题。ASP.NET GridView CSS在打开排序时出现问题

其他一切正常。例如，我可以将标题背景更改为红色，并将其变为红色，并且适当地应用网格样式的其余部分。

任何人都有关于交易的线索？我在下面包含了代码片段。我对CSS也很新。如果任何人有任何提示，以某种方式使我的CSS标记更好，让我知道。

谢谢！

这是ASP.NET代码。我可以将ForeColor =“White”添加到HeaderStyle中，并且一切正常。

<asp:GridView ID="GridView1" runat="server" CssClass="grid" 
AutoGenerateColumns="False" DataKeyNames="ID" DataSourceID="SqlDataSource1" 
EmptyDataText="There are no data records to display." AllowSorting="True" 
CellPadding="4" GridLines="Both"> 
<FooterStyle CssClass="grid-footer" /> 
<RowStyle CssClass="grid-row" /> 
    <Columns> 
     <asp:BoundField DataField="Kingdom" HeaderText="Kingdom" 
      SortExpression="Kingdom" /> 
     <asp:BoundField DataField="Phylum" HeaderText="Phylum" 
      SortExpression="Phylum" /> 
     <asp:BoundField DataField="GenusSpeciesStrain" HeaderText="Genus species (strain)" 
      SortExpression="GenusSpeciesStrain" /> 
     <asp:BoundField DataField="Family" HeaderText="Family" 
      SortExpression="Family" /> 
     <asp:BoundField DataField="Subfamily" HeaderText="Subfamily" 
      SortExpression="Subfamily" /> 
     <asp:BoundField DataField="ElectronInput" HeaderText="Electron Input" 
      SortExpression="ElectronInput" /> 
     <asp:BoundField DataField="OperonLayout" HeaderText="Operon Layout" 
      SortExpression="OperonLayout" /> 
    </Columns> 
    <PagerStyle CssClass="grid-pager" /> 
    <SelectedRowStyle CssClass="grid-selected-row" /> 
    <HeaderStyle CssClass="grid-header" /> 
    <EditRowStyle CssClass="grid-row-edit" /> 
    <AlternatingRowStyle CssClass="grid-row-alternating" />

这是我使用的样式表内容：

body { 
} 

.grid 
{ 
    color: #333333; 
} 

.grid-row 
{ 
    background-color: #EFF3FB; 
} 

.grid-row-alternating 
{ 
    background-color: White; 
} 

.grid-selected-row 
{ 
    color: #333333; 
    background-color: #D1DDF1; 
    font-weight: bold; 
} 

.grid-header, .grid-footer 
{ 
    color: White; 
    background-color: #507CD1; 
    font-weight: bold; 
} 

.grid-pager 
{ 
    color: White; 
    background-color: #2461BF; 
    text-align: center; 
} 

.grid-row-edit 
{ 
    background-color: #2461BF; 
}

答

我猜明亮的蓝色是非常相似的颜色超链接。使gridview可排序意味着你将在头部有一个标签，而不是纯文本。

这应该对它进行排序：

.grid-header a { color: White; background-color: #507CD1; font-weight: bold; }

是的。我自己刚刚得出这个结论。 VS.NET创建内联样式，因此它将应用于文本或超链接。如果您自己推出，则必须添加超链接信息。谢谢！ – 2008-11-21 15:50:08

答

在样式表头的颜色是正确的：＃507CD1是明亮的蓝色。那么它在哪里显示为白色？在Visual Studio的设计师？你的意思是标题背景要白色，还是文字？

此外，它也不会伤害从标记中删除ForeColor =“白色”。它已经在样式表中。

更新：我没有完全读完这个问题，我的道歉。以上是无稽之谈。（或者当我编写答案时，这个问题已经被修改了。不知道）

答

我不确定你是如何在你的标题上得到一个白色的背景w /或者没有排序，因为你有网格头背景设置蓝色（＃507CD1）在你的CSS：

.grid-header, .grid-footer { color: White; background-color: #507CD1; font-weight: bold; }

这里就是它需要的，如果你想报头背景白色（你需要的字体颜色更改为较暗也）：

.grid-header, .grid-footer { color: #000; background-color: #fff; font-weight: bold; }

，你还需要从GridView的HeaderStyle删除前景色属性能够看到的文字在你的头，像这样：

<HeaderStyle CssClass="grid-header" />

答

以下为我工作。Add：

.grid-header th a 
{ 
    color: White; 
}

“th a”不管AllowSorting如何工作。

答

这是我能得到它的工作的唯一办法：

.HeaderStyle a 
{ 
    background-color: #DE7B0A; 
    color: White!important 
}

我注意到的是被渲染的.aspx把一个style="color:#333333"标签链接本身。使颜色选项!important覆盖默认的渲染是我可以使其工作的唯一方法。

希望能帮到别人。

答

注意的是，除了在风格上个的詹姆斯在印建议，在

.grid头次A {颜色：白色; }

将通过设置您用于排序列来防止页面部分中的链接受到影响。

ASP.NET GridView CSS在打开排序时出现问题

相关推荐