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

使用方法很简单,

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;
}
posted @ 2013-08-22 12:08  Seasons1987  阅读(505)  评论(0编辑  收藏  举报