Internet Explorer中的ASP.NET Gridview水平对齐

Question

Internet Explorer中的ASP.NET Gridview水平对齐

4 css asp.net gridview

我正在尝试一个统一的位置,我可以编辑我的gridview列的行为和对齐方式.专门看一下头颅.我有一些包含文本值的列,这些列应该是左对齐的值和标题.其他列包含整数,并且应该右对齐值和标题.

"在第一天"我认为一切都很好,Firefox/Chrome正好按照需要显示,然后用户来了,看到一切都是错的(在他们的探索者中)(中心对齐的标题).

因此,我花了无数个小时"和睡眠之夜;""谷歌搜索试图找到解决方案无济于事.

如何唯一地标识要左对齐的一个标题单元格以及另一个右对齐的标题单元格？

我找到了HeaderStyle-CssClass和ItemStyle-CssClass(后者在这个特定情况下并不那么有趣).

问题是每当我在CSS文件中定义对齐时

.HeaderStyle th { text-align: <value>; }

Run Code Online (Sandbox Code Playgroud)

它取代了可能存在的任何其他设置.请记住,文本项应该保留,数字右对齐,包括标题.

在陷入困境的区域中包含HeaderStyle-CssClass是没有问题的,尽管这对以后的支持和维护来说都是相当麻烦的.正确的解决方案将是定义对齐的单个位置,因为它们应分别按照设计.这可以使用themes文件夹中的皮肤来完成吗？

用于演示目的

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="GridviewAlignments.aspx.cs"
Inherits="GridviewAlignments" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Testing GridView Alignment</title>
    <style type="text/css">
        .LeftAlign
        {
            text-align: Left;
        }
        .NoneAlign
        {
            text-align: none;
        }
        .RightAlign
        {
            text-align: Right;
        }
        .JustifyAlign
        {
            text-align: justify;
        }        
        .InheritAlign
        {
            text-align: inherit;
        }
        .HeaderStyle th
        {
            text-align: justify;
        }    
    </style>  
</head>  
<body>  
    <form runat="server">  
    <asp:GridView runat="server" ID="TestAlign" ShowFooter="True" DataSourceID="testDataSource"
        Width="600" CssClass="HeaderStyle">  
        <Columns>  
            <asp:BoundField DataField="left" HeaderText="-left-"
                HeaderStyle-CssClass="LeftAlign" />  
            <asp:BoundField DataField="none" HeaderText="-none-"
                HeaderStyle-CssClass="InheritAlign" />  
            <asp:BoundField DataField="right" HeaderText="-right"
                HeaderStyle-CssClass="RightAlign" />  
        </Columns>  
    </asp:GridView>  
    <asp:ObjectDataSource ID="testDataSource" runat="server" TypeName="TestData" SelectMethod="GetTestGridData"></asp:ObjectDataSource>  
    </form>  
</body>  
</html>

Run Code Online (Sandbox Code Playgroud)

Answer 1

Jas*_*kan 5

您应该使用GridView的HeaderStyle-CssClass属性,而不是使用绑定到<th>的特定CSS类来为标题提供默认样式.

.HeaderStyle {
    text-align: justify
}

<asp:GridView runat="server" ID="TestAlign" ShowFooter="True"
     DataSourceID="testDataSource" Width="600"
     HeaderStyle-CssClass="HeaderStyle">
    <Columns>
        <asp:BoundField DataField="left" HeaderText="-left-"
             HeaderStyle-CssClass="LeftAlign" />
        <asp:BoundField DataField="none" HeaderText="-none-"
             HeaderStyle-CssClass="InheritAlign" />
        <asp:BoundField DataField="right" HeaderText="-right"
             HeaderStyle-CssClass="RightAlign" />
    </Columns>
</asp:GridView>

Run Code Online (Sandbox Code Playgroud)

归档时间：	16 年，1 月前
查看次数：	15683 次
最近记录：	12 年，9 月前