常常看到有的网站通过DropDownList、菜单或按钮实现对整个网站改变页面风格(换肤)。专门Google了一些这方面的资料,总结了一下实现以上功能大致可以分成两类:
1、整个网站统一使用一个CSS文件,保证一类风格。通过切换不同风格的CSS文件实现换肤。这种方法实现
      起来比较简单。
2、不同风格、不同布局的UseControl,使用相同的后台代码(业务逻辑、功能)。通过重定向页面实现
     页面换肤。这种方法比较复杂,以后再讨论。

先看第一种方法:切换CSS文件换肤。
1、正常的页面如果需要指定所引用的CSS文件,必须在<head></head>里用<link>控件指定CSS文件,如
     
[原创]利用CSS实现页面换肤<head>
[原创]利用CSS实现页面换肤[原创]利用CSS实现页面换肤
[原创]利用CSS实现页面换肤 
<link  rel=stylesheet  type=text/css  href=mycss.css />
[原创]利用CSS实现页面换肤
</head>

     如果需要切换CSS,就不能再定死这个<link>了。可以通过后台代码动态地改变这个控件的属性。
     可以用<asp:placeholder>控件来代替。placeholder控件可以理解成一个控件的容器,就像一个透明的包,你往里面装什么,它就是什么。
     现在页面变成了这个样子,我们在里面放了一个空的placeholder来代替link.
[原创]利用CSS实现页面换肤<head>
[原创]利用CSS实现页面换肤    [原创]利用CSS实现页面换肤
[原创]利用CSS实现页面换肤    
<asp:placeholder id="MyCss" runat="server"/>
[原创]利用CSS实现页面换肤
</head>
    在后台代码中定义一个函数,负责往placeholder里装东西,这里装css文件
[原创]利用CSS实现页面换肤public void ChangeSkin(string cssFile)
}


到这里,可以在页面里放2个按钮,按按钮切换不同的CSS文件

2、有的网站能把用户选择的样式保存起来,下次访问继续保留上次选择的风格。
     对于此类,可以用客户端的Cookie来保留选择的样式。

 

[原创]利用CSS实现页面换肤private void Page_Load(object sender, System.EventArgs e)
}

     
    当用户按下按钮选择样式的时候,还需要保留这些信息到Cookie中。

        public void SetCookie(string style)
        {

                HttpCookie myCookie 
= new HttpCookie("Skin");
                myCookie.Value 
= style;
                Response.Cookies.Add(myCookie);

        }

 

        public void btClick(object src, EventArgs e)
        {
            SetCookie(
"Red");

            ChangeSkin(
"mycss2.css");
            label2.Text 
= "现在设为红色" ;
            
        }



 

相关文章:

  • 2022-12-23
  • 2022-12-23
  • 2021-10-05
  • 2022-12-23
  • 2022-12-23
  • 2021-09-03
  • 2021-08-02
  • 2022-03-01
猜你喜欢
  • 2021-05-24
  • 2022-12-23
  • 2021-12-30
  • 2022-12-23
  • 2021-06-11
  • 2022-12-23
相关资源
相似解决方案