永远的不倒翁

No pains,No gains!

导航

DNN皮肤制作

Posted on 2006-11-02 12:51  永远的不倒翁  阅读(521)  评论(0)  编辑  收藏  举报
初学,不当之处,请多多指教
1.最后目录结构
   皮肤名称
      --skins
         --皮肤名称.zip(skin.css,xx.ascx或xx.html,xx.jpg)
      --containers
         --皮肤名称.zip (container.css,xxx.ascx或xxx.html,xxx.jpg)    

2. 首先,确定版面布局
      <!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>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<style>
body{background:#555;}
.skinwrapper{border:5px #333 solid;background:#FFF;padding:1px;}
.skinheader{padding:10px;background:#EEE;}
.skinmenu{padding:10px;background:#C00;}
.skinuser{padding:5px;background:#CCC;text-align:right;}
.skincontentstable{width:100%;}
.leftpane{background:#EEE;width:200px;}
.contentpane{background:#FFF;}
.rightpane{background:#EEE;width:200px;}
.skinfooter{padding:5px;background:#CCC;text-align:center;}
</style>
</head>
<body>
<div class="skinwrapper">
            <div class="skinheader">Logo</div>
            <div class="skinmenu">Menu</div>
            <div class="skinuser">Register - Login</div>
            <table border="0" cellpadding="10" cellspacing="0" class="skincontentstable" summary="Design Table">
                        <tr valign="top">
                                    <td class="leftpane">Left Pane</td>
                                    <td class="contentpane">Content Pane</td>
                                    <td class="rightpane">Right Pane</td>
                        </tr>
            </table>
            <div class="skinfooter">Copyright</div>
</div>
</body>
</html>
3.把body标签内的东西做为一独立文件保存(xx.ascx或xx.html)
4.把style标签内的东西做为一独立文件保存(skin.css)
5.在xx.ascx或xx.html插入Skin objects
   ascx里如:<div class="skinfooter"><dnn:COPYRIGHT runat="server" id="dnnCOPYRIGHT" CssClass="skinfooter" /></div>
   html里如::<div class="skinfooter">[COPYRIGHT]</div>
如果使用xx.ascx的话,每个 skin object 都需要registered ,如:<%@ Register TagPrefix="dnn" TagName="COPYRIGHT" Src="~/Admin/Skins/Copyright.ascx" %>
   需要注意的是,定义的pane都不许runat=server
6.补充skin.css的样式

containers的作法与这类似...
最后完成的目录如1所示即可.