分享一下不错的样式，适用于Gridview，兼容性还不错！

最新推荐文章于 2018-04-28 11:12:00 发布

weixin_30511039

最新推荐文章于 2018-04-28 11:12:00 发布

阅读量116

点赞数

原文链接：http://www.cnblogs.com/seasons1987/p/3274577.html

版权

使用方法很简单，

1、设置Gridview的【CssClass】属性为【tbinfo】

2、设置Gridview的【BorderWidth】属性为【0】

3、设置Gridview的【CellSpacing】属性为【1】

4、展开Gridview的【PagerStyle】项，找到位于它下面的【CssClass】，并将它的属性设置为【page】即可！

以下为预览效果：

图一、预览效果

下面是css的源代码：

/*-- 表格樣式 --*/
.tbinfo{background: #d6e0ef; line-height: 18px;width: 100%;}
.tbinfo th{font-size:12px;background-color:#97CBFF;border-bottom:1px solid #a5ceef; text-align:center;color:    #003399;}
.tbinfo td{background: #fff;padding:2px 0;}
.tbinfo .lt{background: #fafafa;text-align: right; padding:0 4px; width:15%; white-space:nowrap;}
.tbinfo .rt{background: #fff; text-align:left; padding:0 2px;}
.tbinfo .rt:hover{background: #fafafa;}
.hidden { display:none;}

/*-- 頁碼樣式 --*/
.page
{
    text-align:center;
    height:26px;
}

.page a
{
    padding:2px 6px 2px 6px;
    width:24px;
    border:1px solid blue;
    text-align:center;
    font-size:12px;
    line-height:20px;
}

.page a:hover
{
    padding:2px 6px 2px 6px;
    width:24px;
    border:1px solid red;
    text-align:center;
    font-size:12px;
    line-height:20px;
}

.page span
{
    padding:2px 6px 2px 6px;
    width:24px;
    border:1px solid silver;
    text-align:center;
    font-size:12px;
    line-height:20px;
    color:silver;
}