定义asp的全局网站样式：GridView与纯CSS（不使用VS皮肤） [英] Define global site style for asp:GridView with plain CSS (without using VS Skins)

问题描述

我正在开发一个相当大的aspx web项目，广泛使用asp：GridViews

I am working on a fairly large aspx web project with extensive use of asp:GridViews

我想使用CSS在一个地方定义所有gridview默认情况下会显示。

I'd like to use CSS to define in one place how all gridviews will look, by default.

据我所知，一种方法是通过Visual Studio中的皮肤...但我记得做一点的研究，并发现许多人鄙视皮肤，并始终只使用简单的CSS在asp.net项目（虽然我不能完全记得那么糟糕的他们）。

As far as I understand, one way of doing this is via "Skins" in Visual Studio....but I recall doing a bit of research a while back and found many people despised skins and always used just plain CSS in asp.net projects (although I can't entirely remember what was so bad about them).

所以我的问题是：
1）是否可以做这个全局默认asp：GridView样式使用简单的CSS
2）使用VS皮肤有任何优势，或者只是简单CSS更像强大，易于维护的使用皮肤？

So my questions are: 1) Is it possible to do this global default asp:GridView styling using plain CSS 2) Is there any advantage to using VS Skins at all, or is just plain CSS just as powerful and easily maintained as using skins?

更新：我还要提到有许多风格独特的GridView，如SelectedRowStyle-BackColor;这对我原来的问题有什么影响吗？

UPDATE: I also meant to mention that there are many styles unique to the GridView, such as SelectedRowStyle-BackColor; does this have any impact on my original question? If someone could post or link to any examples of this it would be extremely helpful.

推荐答案

定义样式表并设置这些样式某处：

Define a stylesheet and set these styles up somewhere:

/**
 * GRIDVIEW STYLES
 **/
.gridview {
        font-family:"arial";
        background-color:#FFFFFF;
        width: 100%;
        font-size: small;
}
.gridview th {
        background: #7AC142;
        padding: 5px;
        font-size:small;

}
.gridview th a{
        color: #003300;
        text-decoration: none;
}
.gridview th a:hover{
        color: #003300;
        text-decoration: underline;
}
.gridview td  {
        background: #D9EDC9;
        color: #333333;
        font: small "arial";
        padding: 4px;
}
.gridview tr.even td {
        background: #FFFFFF;
}
.gridview td a{
        color: #003300;
        font: bold small "arial";
        padding: 2px;
        text-decoration: none;
}
.gridview td a:hover {
        color: red;
        font-weight: bold;
        text-decoration:underline;     
} 

然后，您需要设置gridview以利用CssClass和AlternatingRowStyle -CssClass：

Your gridview then needs to be setup to take advantage of these using CssClass and AlternatingRowStyle-CssClass:

<asp:GridView   ID="GridView1"
                runat="server"
                CssClass="gridview"
                AlternatingRowStyle-CssClass="even">

这篇关于定义asp的全局网站样式：GridView与纯CSS（不使用VS皮肤）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！