zoukankan      html  css  js  c++  java
  • 不再为DataGrid生成的表格的单无格中的内容过长、自动折行、表格撑开等问题而烦恼

    是我以前用在一个项目中的,如有些地方不适用于你,你可以修改部分代码。
    功能:    按列分色;
                    过长内容自动隐藏;
                    鼠标Over自动展开;
                    还有些什么我也不记得了。

    隐藏状态                            鼠标Over状态

    使用方法:
    1、下载HTC文件/Files/thinhunan/guidv2.rar
    2、定义以下样式

    /*智能表格样式,在DataGrid设cssclass为Guid,
    表头cssclass:GuidTH,表内容cssclass:GuidTD
    Title为展开单无格时的样式
    */

    .Guid
    {
        border-top
    :0pt solid white;
        table-layout
    : fixed;
        behavior
    :url(GuidV2.htc);
    }

    .GuidTH
    {
        background-color
    : #5f9fd4;
        height
    :21px;
        color
    :white;
        font-weight
    : bold;
    }

    .GuidTD
    {
        height
    :25px;
        padding-left
    :5px;
        background-color
    : #eef2fe;

    }

    .Title
    {
        position
    :relative;top:-2px;left:-2px;
        border-bottom
    :1pt solid #93BEE2;
        border-top
    :1pt solid #93BEE2;
        border-left
    :buttonface 1px ridge;
        border-right
    :buttonface 1px ridge;
        z-index
    :0;
        height
    :20;
        font-size
    :14px;
        background-color
    : #eef2fe;
        padding-top
    :0;
        padding-left
    :0;
        padding-right
    :4px;
        cursor
    :default;
    }

     

    3、DataGrid应用样式:

    <asp:datagrid id="dg1" Runat="server" Width="**%" AutoGenerateColumns="False" DataKeyField="**" cssclass="Guid">
                                    
    <AlternatingItemStyle CssClass="GuidTD"></AlternatingItemStyle>
                                    
    <ItemStyle CssClass="GuidTD"></ItemStyle>
                                    
    <HeaderStyle HorizontalAlign="Center" CssClass="GuidTH"></HeaderStyle>


    4、现在没时间封装成控件,有兴趣者可以做(不过要做得好一点,同时请保留Htc文件中的信息,呵呵)

    5、如果对隔行换色的颜色不满意,在Guidv2.htc文件中修改。

  • 相关阅读:
    mime.types:强制下载 application/force-download
    使用FWTools来导入shp数据到mysql
    测试反应能力的小代码!(娱乐)
    用Vue.js模仿一个百度的页面!(后台写死)
    在Vue.js使用配置(SSH框架的附带使用下){其余代码同上}
    Vue.js理论!
    动态从数据库获取数据(Vue.js)【数据可变】
    发布网站
    Vue.js 的开始!
    二叉树
  • 原文地址:https://www.cnblogs.com/top5/p/1681295.html
Copyright © 2011-2022 走看看