2009-09-07 89 views
2

我目前正在開發將具有多個皮膚的ASP.NET WebForms應用程序。我想要解決這個問題的方法是將每個皮膚放在一個完全獨立的文件夾中,該文件夾將包含所有圖像和CSS,並且CSS將相應地引用圖像。創建具有多個皮膚的ASP.NET Web應用程序?

的文件夾結構是這樣的:

  • /Default.aspx
  • /Skins/Master.css
  • /Skins1/Skin1/Skin1.css
  • /Skins1/Skin1 /圖片/ ...
  • /Skins1/Skin1/Skin2.css
  • /Skins1/Skin2 /圖片/ ...
  • /滑雪NS1/Skin1/Skin3.css
  • /Skins1/Skin3 /圖片/ ...

所以,舉例來說,我們可能有:

<div id="foo-logo"></div> 
<a href="/bar/"><div id="bar-logo"></div></a> 

然後在CSS:

#top-logo { height: 100px; width:200px; background:url(images/foo-logo.jpg); } 
#bar-logo { height: 50px; width:100px; background:url(images/bar-logo.jpg); } 

我這背後的邏輯是避免具有與所述代碼爲串聯皮膚夾引用,像這樣:

<img src="/skins/<%=Settings.CurrentSkin%>/images/foo-logo.jpg" /> 
<a href="/bar/"><img src="/skins/<%=Settings.CurrentSkin%>/images/bar-logo.jpg" /></a> 

這樣,HTML將保持乾淨並且完全獨立,並且可以通過簡單引用不同的CSS文件來完全更改皮膚,並且無需更新圖像標記。

的這一點,我能想到的主要缺點是:

  • 包含元素對圖像尺寸將需要,因爲它們會作爲CSS背景圖像
  • 網絡被實現爲在CSS被明確指定應用程序可能不會降級,如果重要品牌元素(例如徽標只能用CSS可見)

使用此方法時我還應該注意什麼和/或是否有更好的方法實現此目的?

+0

如何選擇合適的皮膚?它是用戶特定的設置,還是根據其他條件自動選擇的設置? –

+0

Web應用程序將具有多個URL,並將根據用於訪問它的URL來選擇外觀。 – Mun

回答

1

的WebForms有對主題的支持和剝皮它做了很多的你似乎什麼想在這裏做,一些有用的文章

Ode to CodeMSDN

什麼剝皮基本上可以讓你做的是確定單獨的樣式表和控制皮膚。你的文件夾結構會像

App_Themes文件/ Skin1

App_Themes文件/ Skin2

App_Themes文件/ Skin3

...

然後,您可以使用asp:Image控件指向每個皮膚ID的不同圖像URL(或者您可以通過CSS執行此操作)。

相關問題