DotNetNuke Skinning Whitepaper（皮肤制作部分）

DotNetNuke Skinning Whitepaper（皮肤制作部分）2010-04-05 cnblogs 大厨师制作皮肤没有特定的顺序，但如果按如下顺序操作会更好。

设置皮肤开发环境

为了简化皮肤的开发并加快后续打包的速度，建议按如下的文件结构组织文件

Skins
SkinName （ 你开发的皮肤包的自定义名称 ）
… （ 这里放要发布的皮肤包的zip文件）
containers （ this is a static name to identify the container files for the skin package ）
… （ 与容器相关的所有资源文件 ）
skins （ this is a static name to identify the skin files for the skin package
… （ 与皮肤有关的所有文件 ）

例如：

设计皮肤

The free-form nature of skinning provides almost unlimited creative freedom with your design.设计者通常创建一幅图片作为最初的设计原型（使用PhoteShop或其他的专业设计工具）.应当注意的是在原型设计当中应包括所有的用户界面元素，包括静态元素如图片和文本，同时也要包含动态元素，如登录链接、导航栏、菜单等。 but it should also include active elements such as Login links, a navigation/menu system, etc… 由于本系统在运行时动态的加载内容，所以在设计是要为这些内容留出空间。Since this is a portal system which injects dynamic content at runtime, you will need to leave room in your design for this content.

设计结束的时候，设计者就要站到下一步：将图片转换为html文档。如何有效的降图形元素转换为html形式涉及到很多技术问题。HTML展示形式要比自由战士的图片要规整很多而且将图片转换为HTML文档对于最终产品的展现形式非常重要。由于HTML文档本身也有很多动态的属性，所以你也需要处理这些动态的问题。例如, 你学要确定皮肤的某一部分是否根据客户端浏览器的屏幕分辨率缩放或者保持固定宽度。

选择HTML 或ASCX编辑器.

如果你熟悉HTML表格和相关属性并且能处理简单的CSS，你就可以制作皮肤。所见即所得的编辑器是其变得相当容易。你可以使用 FrontPage, HotMetal, ColdFusion, DreamWeaver, VS.NET等等，任何你喜欢的编辑器。 ’反正都是HTML。

所有的HTML标记必须是"well formed." 就是说所有的HTML标记都必须闭合。例如, 你有一个 <TABLE> 标记, 就必须用</TABLE> 闭合。所有的标记的属性的“=”边上不留空格, 属性值必须有双引号（如<TABLE WIDTH=”200”>… </TABLE> ）.通常专业的HTML编辑器会自动处理，但是某些参数设置可能是别的形式，一次最好仔细检查一下。