ASP.NET2.0 Skin+CSS 测试

zoukankan html css js c++ java

ASP.NET2.0 Skin+CSS 测试

显示出来如上图:

ASPX页面的代码：

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="SammyDiv.aspx.cs" Inherits="Buying_SammyDiv" Theme = "sammyTest" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>Sammy Test Div</title>
    <style type ="text/css">
        #rtop{}{
        margin:0 auto;
        height:30%;
        vertical-align:middle;
        text-align:center;
        font-family:Arial;
        font-size:x-large;
        background: #CCCC00;
        }

        #rbottom{}{
        margin:0 auto;
        height:70%;
        vertical-align:middle;
        text-align:center;
        font-family:Arial;
        font-size:x-large;
        background: #CCee00;
        }

        #left{}{
        float:left;
        height:100%;
        width:50%;
        vertical-align:middle;
        text-align:center;
        font-family:Arial;
        font-size:x-large;
        background: #CCCCed;
        }

        #container{}{
        width:900px;
        height:600px;
        vertical-align:middle;
        text-align:center;
        font-family:Arial;
        font-size:x-large;
        background-color:Green
        }

        #leftside{}{
        width:40%;
        height:60%;
        float:left;
        font-family:Arial;
        font-size:x-large;
        vertical-align:middle;
        text-align:center;
        background: gray;
        }

        #rightside{}{
        width:60%;
        height:60%;
        float:left;
        vertical-align:middle;
        text-align:center;
        font-family:Arial;
        font-size:x-large;
        background: #Cdfd00;
        }

        #foot{}{
        height:20%;
        clear:both;
        vertical-align:middle;
        text-align:center;
        font-family:Arial;
        font-size:x-large;
        background-color:InactiveBorder;
        }
        #header{}{
        height:20%;
        clear:both;
        vertical-align:middle;
        text-align:center;
        font-family:Arial;
        font-size:x-large;
        background-color:Red
        }


    </style>
</head>
<body>
    <form id="formtest" runat="server">
    <div  id="container">
        <div id="header">
            header
        </div>
        <div id="midbody">
          <div id="leftside">
                leftside
              <br />
              <asp:Calendar ID="Calendar1" runat="server"/>
              <br />
          </div>
          <div id="rightside">
             <div id="rtop">
                right top
                <div style = "height: 500;">
                    <asp:Button ID = "ButtonTest" runat = "Server" Text = "Test"/>
                    <asp:Button ID = "Button1" runat = "Server" Text = "Test"/>
                    <asp:Button ID = "Button2" runat = "Server" Text = "Test"/>
                    <asp:Button ID = "Button3" runat = "Server" Text = "Test"/>
                </div>
             </div>
             <div id="rbottom">
                 <div id="left">
                    left
                    <div>
                        <asp:Button ID = "Button4" runat = "Server" Text = "Test"/>
                        <asp:Button ID = "Button5" runat = "Server" Text = "Test"/>
                        <asp:Button ID = "Button6" runat = "Server" Text = "Test"/>
                        <asp:Button ID = "Button7" runat = "Server" Text = "Test"/>
                    </div>
                 </div>
                 <div id="right">
                    right
                    <div style ="float:right">
                        <h3>Disabling Themes for a Control</h3>
                        <asp:Label ID="Label4" runat="server" Text="Hello 1" /><br />
                        <asp:Label ID="Label5" runat="server" Text="Hello 2" EnableTheming="False" /><br />
                        <asp:Label ID="Label6" runat="server" Text="Hello 3" /><br />
                    </div>
                 </div>
             </div>
          </div>
        </div>
        <div id="foot">
            foot
        </div>
        </div>
    </form>
</body>
</html>
Skin.skin中的代码：

<asp:Button  runat = "Server" CssClass = "button60"/>

<asp:Label Font-Bold="true" ForeColor="orange" runat="server" />

<asp:Calendar BackColor="White" BorderColor="Black" BorderStyle="Solid" CellSpacing="1"
  Font-Names="Verdana" Font-Size="8pt" ForeColor="Black" Height="250px"
  NextPrevFormat="ShortMonth" Width="330px" runat="server">
  <SelectedDayStyle BackColor="#333399" ForeColor="White" />
  <OtherMonthDayStyle ForeColor="#999999" />
  <TodayDayStyle BackColor="#999999" ForeColor="White" />
  <DayStyle BackColor="#CCCCCC" />
  <NextPrevStyle Font-Bold="True" Font-Size="8pt" ForeColor="White" />
  <DayHeaderStyle Font-Bold="True" Font-Size="8pt" ForeColor="#333333" Height="8pt" />
  <TitleStyle BackColor="#333399" BorderStyle="Solid" Font-Bold="True" Font-Size="12pt"
    ForeColor="White" Height="12pt" />
</asp:Calendar>
Style.CSS中的代码：

.button60
{
    font-weight: bold;
    font-size: 12pt;
    background-image: url(../Images/EPS_Button_BG_60.gif);
     60px;
    cursor: hand;
    color: Blue;
    height: 50px;

    text-align: center;
    border-style: none;
}

查看全文

相关阅读:
String StringBuffer StringBuilder 之间的区别
 StringBuffer和String的相互转换
 StringBuffer的替换和反转和截取功能
 StringBuffer的添加与删除功能
 后端——框架——容器框架——spring_core——容器
 后端——框架——容器框架——spring_core——bean以及xml配置
 后端——框架——容器框架——spring_core——注解
 后端——框架——容器框架——spring_core——国际化 & Properties
后端——框架——容器框架——spring_core——Resource
后端——框架——容器框架——spring_core——校验器

原文地址：https://www.cnblogs.com/songsh96/p/659746.html