vs2015 dynamicweb7-1 主题样式如何使用

最新推荐文章于 2023-07-06 08:03:22 发布

虾米大王

最新推荐文章于 2023-07-06 08:03:22 发布

阅读量322

点赞数

分类专栏： c# asp.net 文章标签： c#

本文链接：https://blog.csdn.net/modern358/article/details/115392804

版权

c# 同时被 2 个专栏收录

284 篇文章 0 订阅

订阅专栏

asp.net

258 篇文章 2 订阅

订阅专栏

项目中添加App_Themes文件夹，其下添加Green文件，

文件夹中增加2个文件，分别为 .skin .css

skinfile1.skin


<%-- 3、建立主题文件夹App_Themes，增加SkinFile1.skin文件，在文件内添加控件主题样式--%>
<asp:TextBox runat="server" BackColor="#ccffcc" ForeColor="#666699" />
<asp:Button runat="server" BackColor="#ccffcc" ForeColor="666699" BorderColor="#336600" BorderStyle="Solid" BorderWidth="1px" />
<%-- 6、增加SkinId，可以单独给控件用 --%>
<asp:TextBox runat="server" SkinId="txtYellow" BackColor="Yellow" />

stylesheet1.css

/*4、在主题文件夹下，增加css文件，添加控制各元素的样式代码
    
    */

body {
    background-color:#eafcfe;
}


#top {
    background-image:url("images/BannerG.jpg");
    background-color:green;
}

#mid #left {
    background-image:url("images/LogoLeftG.jpg");
    background-color:green;
}

创建模板页

masterpage.master

<%@ Master Language="C#" AutoEventWireup="true" CodeBehind="MasterPage.master.cs" Inherits="dynamicweb7_1.MasterPage" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
    <style type="text/css">
        body {
            margin:0;
        }

        #top {
            width:800px;
            height:150px;
            margin: 0 auto;
            border:1px solid #c0c0c0;
            background:url("images/banner.jpg");
            background-repeat:no-repeat;
            background-position:center center;
            background-color:#00ff90;
        }

        #mid {
            width:800px;
            height:450px;
            margin: 0 auto;
            border:1px solid #808080;
            
        }

        #mid #left {
            width:150px;
            height:450px;
            float:left;
            background:url("images/logoleft.jpg") left top no-repeat;
            background-color:#00ff90;
        }

        #mid #main {
            width:648px;
            height:450px;
            float:right;
        }

        #bottom {
            border:1px solid #808080;
            width:800px;
            height:40px;
            margin: 0 auto;
            text-align:center;
            font-size:small;
        }
    </style>
</head>
<body>
    <!-- 1、母版页的制作 -->
    <form id="form1" runat="server">
        <div id="top">
            Banner
            网站标题：<asp:TextBox ID="txtTitle" runat="server"></asp:TextBox>
        </div>
        <div id="mid">
            <div id="left">
                <br /><br /><br />
                <asp:HyperLink ID="hlDefault" runat="server" NavigateUrl="~/Default.aspx" ForeColor="#ffcc00">主页</asp:HyperLink><br />
                <asp:HyperLink ID="hlSignIn" runat="server" NavigateUrl="~/SignIn.aspx" ForeColor="#ffcc00">登录</asp:HyperLink><br />
                <asp:HyperLink ID="hlRegister" runat="server" NavigateUrl="~/Register.aspx" ForeColor="#ffcc00">注册</asp:HyperLink><br />
                <asp:HyperLink ID="hlPerInfo" runat="server" NavigateUrl="~/PersonalInfo.aspx" ForeColor="#ffcc00">个人信息</asp:HyperLink><br />
                <asp:HyperLink ID="hlFeedback" runat="server" NavigateUrl="~/Feedback.aspx" ForeColor="#ffcc00">建议反馈</asp:HyperLink><br />
                <asp:HyperLink ID="hlStudentInfo" runat="server" NavigateUrl="~/StudentInfo.aspx" ForeColor="#ffcc00">学生信息管理</asp:HyperLink>
            </div>
            <div id="main">
                <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server"></asp:ContentPlaceHolder>
            </div>
        </div>
        <div id="bottom">
            <asp:Image ID="Image1" runat="server" ImageUrl="~/images/logo.jpg" ImageAlign="Middle"/>
            Bottom
        </div>
    </form>
</body>
</html>

创建内容页

studentinfo.apsx

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="StudentInfo.aspx.cs" Inherits="dynamicweb7_1.StudentInfo" MasterPageFile="~/MasterPage.Master" %>
<asp:Content ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    <center><h3>学生信息管理</h3></center>
    <!--2、内容页，套用模板页的制作 -->
</asp:Content>

default.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="dynamicweb7_1.Default" MasterPageFile="~/MasterPage.Master" %>
<asp:Content ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    <div style="text-align:center">
        <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
        学生信息管理系统主页<br /><br />
        <asp:Label ID="lblUname" runat="server" Text=""></asp:Label><br /><br />
        <asp:UpdatePanel ID="UpdatePanel1" runat="server">
            <ContentTemplate>
                <asp:Timer ID="Timer1" runat="server" Interval="10000"></asp:Timer>
                网站在线人数：<asp:Label ID="lblOnLineNum" runat="server" Text=""></asp:Label>
                &nbsp;&nbsp;当前用户在线时间：<asp:Label ID="lblOnLineTime" runat="server" Text=""></asp:Label>
            </ContentTemplate>
        </asp:UpdatePanel>
    </div>
</asp:Content>

personalinfo.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="PersonalInfo.aspx.cs" Inherits="dynamicweb7_1.PersonalInfo" MasterPageFile="~/MasterPage.Master" %>
<asp:Content ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    <center><h3>个人信息</h3></center>
    <asp:Button ID="btnGet" runat="server" Text="获取标题" OnClick="btnGet_Click" />
    <asp:Label ID="lblShow" runat="server" Text=""></asp:Label>
</asp:Content>

personalinfo.aspx.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace dynamicweb7_1
{
    public partial class PersonalInfo : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {

        }

        protected void btnGet_Click(object sender, EventArgs e)
        {
            //9、如何从内容页获取母版页控件的值
            TextBox tbTitle = (TextBox)Master.FindControl("txtTitle");
            if (tbTitle != null)
            {
                lblShow.Text = tbTitle.Text;
            }
        }
    }
}

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Register.aspx.cs" Inherits="dynamicweb7_1.Register" MasterPageFile="~/MasterPage.Master" %>
<asp:Content ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    <center><h3>注册</h3></center>

</asp:Content>

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace dynamicweb7_1
{
    public partial class Register : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {

        }

        protected void Page_PreInit(object sender, EventArgs e)
        {
            //8、采用编程方式，可以在PreInit事件中，添加主题
            Page.Theme = "Green";
        }
    }
}

signin.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="SignIn.aspx.cs" Inherits="dynamicweb7_1.SignIn" MasterPageFile="~/MasterPage.Master" Theme="Green" %>
<asp:Content runat="server" ContentPlaceHolderID="ContentPlaceHolder1">
    <!-- 5、在页面中首行配置中，添加Theme=“”，可以配置页面级的主题模式 -->
    <center><h3>用户登录</h3></center>
    <table style="border:1px solid #cccccc;margin:0 auto;text-align:center;">
        <tr>
            <td>
                用户名：
            </td>
            <td>
                <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
            </td>
        </tr>
        <tr>
            <td>
                密码：
            </td>
            <td>
                <asp:TextBox ID="TextBox2" runat="server" TextMode="Password"></asp:TextBox>
            </td>
        </tr>
        <tr>
            <td colspan="2">
                <asp:Button ID="Button1" runat="server" Text="登录" />
            </td>
        </tr>
        <tr>
            <td colspan="2">
                <!-- 7、在控件中，设置SkinId，可以单独配置某个控件的主题样式-->
                单独设置控件主题的文本框：<asp:TextBox ID="TextBox3" runat="server" SkinID="txtYellow"></asp:TextBox>
            </td>
        </tr>
    </table>
</asp:Content>