zoukankan      html  css  js  c++  java
  • GridView中对表头设定背景图片

    GridView中对表头设定背景图片

     

    后台实现方法:


    protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
    {
        if (e.Row.RowType == DataControlRowType.Header)
        {
            e.Row.Attributes.Add("style", "background-image:url('background.gif')");
        }
    }

    前台实现方法:

    HTML code


    <asp:GridView runat="server" ID="gvStatList" AllowPaging="false" Width="100%" CssClass="grid"
    AutoGenerateColumns="false" Visible="true" ShowFooter="false">
    <HeaderStyle CssClass="grid-head" />
    </asp:GridView>

    CSS code:


    .grid-head {
     font-size: 14px;
     font-weight: normal;
     color: #FFFFFF;
     background-image: url(../images/grid-bg.gif);
     text-align:center;
     vertical-align:middle;
     height: 28px;
    }
    ================================其它blog=======================================

    设置GridView表头的背景图片

     
    方法一:
    protected void Page_Load(object sender, EventArgs e)
        {
           //UserGrid.Attributes.Add("bordercolor", "#a7b8d9");
            UserGrid.HeaderRow.Attributes.Add("style", "background-image:url('images/bj1.png')");
       }
     
     

    最近在做一个网站,显示数据时为了方便使用了GridView。虽然GridView显示数据的功能很强也很方便,但它的样式却并不美观。为了使GridView的显示样式美观一些,经常需要设置表头的背景,我总结出的方法如下: 方法一: 在GridView的OnRowDataBound事件中设置背景,代码如下:

    protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
    {
    if (e.Row.RowType == DataControlRowType.Header)
    {
    e.Row.Attributes.Add("style", "background-image:url('images/title.gif')");
    }
    }

    方法二: 和上面的方法一样,只是代码不一样:

    protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
    {
    if (e.Row.RowType == DataControlRowType.Header)
    {
    e.Row.Style.Add("background-image", "images/title.gif");
    }
    } 

    方法三: 使用CSS,设置GridView每一列的HeaderStyle的CssClass习性,代码如下:

     【这种方法,试了,好像无效。但设置背景色是可以的。】

    <style type="text/css">
    .headbackground
    {
    background-image:url(images/title.gif);
    }
    </style> <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False">
    <Columns>
    <asp:BoundField DataField="id" HeaderText="编号">
    <HeaderStyle CssClass="headbackground" />
    </asp:BoundField>
    <asp:HyperLinkField DataTextField="title" HeaderText="标题">
    <HeaderStyle CssClass="headbackground" />
    </asp:HyperLinkField>
    </Columns>
    </asp:GridView>
  • 相关阅读:
    Code Review 五问五答
    JavaScript 10分钟入门
    swagger editor使用
    Tyk API网关介绍及安装说明
    Castle 多继承选择
    线程信息的获取和设置
    s3 api接口的调用
    在Hadoop集群上的HBase配置
    OpenStack 单元测试
    在Hadoop集群上的Hive配置
  • 原文地址:https://www.cnblogs.com/proving/p/10755274.html
Copyright © 2011-2022 走看看