4

ASP.NET アプリケーションで GridView を作成し、オート フォーマット ツールを使用して魅力的なスタイルを適用しました。現在、スタイル マークアップを CSS シートに移動していますが、ヘッダー行のテキストの色が正しくないという奇妙な問題が発生しています (白である必要がありますが、明るい青で表示されます)。 この問題は、並べ替えをオンにした場合にのみ発生します。

他のすべては正常に動作します。たとえば、ヘッダーの背景を赤に変更すると、赤に変わり、残りのグリッド スタイルが適切に適用されます。

取引が何であるかについて何か手がかりを持っている人はいますか? 以下にコード スニペットを含めました。私はCSSにもかなり慣れていません。CSS マークアップを改善するためのヒントがあれば、教えてください。

ありがとう！

ASP.NET コードは次のとおりです。HeaderStyle に ForeColor="White" を追加すると、すべてが正常に機能します。

<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;
}
4

6 に答える 6

5

明るい青はハイパーリンクの色に非常に似ていると思います。グリッドビューを並べ替え可能にするということは、プレーン テキストだけでなく、ヘッダー内に a タグを含めることを意味します。

これはそれをソートする必要があります：

.grid-header a { color: White; background-color: #507CD1; font-weight: bold; }
于 2008-11-21T15:43:14.317 に答える
1

これは私がそれを機能させることができる唯一の方法です：

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

.aspxレンダリングされるものがstyle="color:#333333"リンク自体にタグを付けることに気づきました。デフォルトのレンダリングをオーバーライドするカラーオプションを作成する!importantことが、それを機能させる唯一の方法です。

それが誰かを助けたことを願っています。

于 2009-09-30T16:14:07.380 に答える
1

CSS でグリッド ヘッダーの背景が青色 (#507CD1) に設定されているため、並べ替えを使用して、または並べ替えなしでヘッダーに白い背景を取得する方法がわかりません。

.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 属性から ForeColor を削除する必要があります。

<HeaderStyle CssClass="grid-header" />
于 2008-11-21T15:35:32.897 に答える
1

以下は私のために働いた。追加：

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

" th a" は、AllowSorting に関係なく機能します。

于 2009-07-17T13:46:27.527 に答える
0

James in Indy が提案した th in style の追加に注意してください。

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

ソート列に使用する設定によってページャーセクションのリンクが影響を受けるのを防ぎます。

于 2013-01-02T21:39:34.420 に答える
0

スタイルシートのヘッダーの色は正しいです: #507CD1 は明るい青です。では、どこが白く見えるのでしょうか。Visual Studio のデザイナーで? ヘッダーの背景を白にするということですか、それともテキストを白にするということですか?

また、マークアップから ForeColor="White" を削除しても問題ありません。すでにスタイルシートに含まれています。

更新：質問を十分に読んでいません。申し訳ありません。上記はナンセンスです。（または、回答を作成している間に質問が変更されました。わかりません）

于 2008-11-21T15:11:58.437 に答える