以前美工做的少现在没有美工了一切都得靠自己了,做了一个GridView的皮肤特意放上来以备不时之需。
Skin:
CSS:
Skin:
<%--
默认的外观模板。以下外观仅作为示例提供。
1. 命名的控件外观。SkinId 的定义应唯一,因为在同一主题中不允许一个控件类型有重复的 SkinId。
<asp:GridView runat="server" SkinId="gridviewSkin" BackColor="White" >
<AlternatingRowStyle BackColor="Blue" />
</asp:GridView>
2. 默认外观。未定义 SkinId。在同一主题中每个控件类型只允许有一个默认的控件外观。
<asp:Image runat="server" ImageUrl="~/images/image1.jpg" />
--%>
<asp:GridView runat="server" SkinId="Default" CssClass="GridFrame" CellPadding="0" CellSpacing="0" AutoGenerateColumns="False">
<RowStyle CssClass="GridItem" />
<EditRowStyle CssClass="GridEdit" />
<SelectedRowStyle CssClass="GridHeader" />
<PagerStyle CssClass="GridItem" />
<HeaderStyle CssClass="GridHeader" />
<FooterStyle CssClass="GridFooter" />
<AlternatingRowStyle CssClass="GridAlter" />
</asp:GridView>
默认的外观模板。以下外观仅作为示例提供。
1. 命名的控件外观。SkinId 的定义应唯一,因为在同一主题中不允许一个控件类型有重复的 SkinId。
<asp:GridView runat="server" SkinId="gridviewSkin" BackColor="White" >
<AlternatingRowStyle BackColor="Blue" />
</asp:GridView>
2. 默认外观。未定义 SkinId。在同一主题中每个控件类型只允许有一个默认的控件外观。
<asp:Image runat="server" ImageUrl="~/images/image1.jpg" />
--%>
<asp:GridView runat="server" SkinId="Default" CssClass="GridFrame" CellPadding="0" CellSpacing="0" AutoGenerateColumns="False">
<RowStyle CssClass="GridItem" />
<EditRowStyle CssClass="GridEdit" />
<SelectedRowStyle CssClass="GridHeader" />
<PagerStyle CssClass="GridItem" />
<HeaderStyle CssClass="GridHeader" />
<FooterStyle CssClass="GridFooter" />
<AlternatingRowStyle CssClass="GridAlter" />
</asp:GridView>
CSS:
.GridFrame
{
margin-top: 5px;
border-collapse: collapse;
border-right: #7c9ccf 1px solid;
border-top: #7c9ccf 1px solid;
border-left: #7c9ccf 1px solid;
border-bottom: #7c9ccf 1px solid;
}
.GridItem td ,.GridAlter td
{
border-right: #999999 1px solid;
border-top: #999999 1px solid;
border-left: #999999 1px solid;
border-bottom: #999999 1px solid;
}
.GridItem
{
font-family: arial;
font-size: 9pt;
background: #f1f1f1;
padding: 0px 4px 0px 4px;
height: 14px;
}
.GridEdit
{
font-family: arial;
font-size: 9pt;
background: #ffffff;
padding: 0px 4px 0px 4px;
height: 14px;
}
.GridHeader
{
font: bold ;
font-family: 宋体;
font-size: 9pt;
background: #8caae7;
border-bottom: #7c9ccf 1px solid;
border-top: #7c9ccf 1px solid;
color: #ffffff;
text-align:center;
height:18px;
}
.GridHeader th
{
font: bold ;
font-family: 宋体;
font-size: 9pt;
background: #8caae7;
border-bottom: #7c9ccf 1px solid;
border-top: #7c9ccf 1px solid;
color: #ffffff;
text-align:center;
}
.GridAlter
{
font-family: arial;
font-size: 9pt;
background: #f1f1f1;
padding: 0px 4px 0px 4px;
height: 14px;
}
{
margin-top: 5px;
border-collapse: collapse;
border-right: #7c9ccf 1px solid;
border-top: #7c9ccf 1px solid;
border-left: #7c9ccf 1px solid;
border-bottom: #7c9ccf 1px solid;
}
.GridItem td ,.GridAlter td
{
border-right: #999999 1px solid;
border-top: #999999 1px solid;
border-left: #999999 1px solid;
border-bottom: #999999 1px solid;
}
.GridItem
{
font-family: arial;
font-size: 9pt;
background: #f1f1f1;
padding: 0px 4px 0px 4px;
height: 14px;
}
.GridEdit
{
font-family: arial;
font-size: 9pt;
background: #ffffff;
padding: 0px 4px 0px 4px;
height: 14px;
}
.GridHeader
{
font: bold ;
font-family: 宋体;
font-size: 9pt;
background: #8caae7;
border-bottom: #7c9ccf 1px solid;
border-top: #7c9ccf 1px solid;
color: #ffffff;
text-align:center;
height:18px;
}
.GridHeader th
{
font: bold ;
font-family: 宋体;
font-size: 9pt;
background: #8caae7;
border-bottom: #7c9ccf 1px solid;
border-top: #7c9ccf 1px solid;
color: #ffffff;
text-align:center;
}
.GridAlter
{
font-family: arial;
font-size: 9pt;
background: #f1f1f1;
padding: 0px 4px 0px 4px;
height: 14px;
}