如何制作支持XHTML的DotNetNuke皮肤

制作XHTML皮肤 DNN 4.x 时代默认皮肤的弊病

在DNN4.x时代制作皮肤时默认的Doctype是HTML，使用HTML Doctype时你会发现CSS的表现异常的不稳定，例如应该默认左对齐的地方会莫名其妙的居中，margin:auto; 居中的代码在不同浏览器的表现又有很大的差异，这些问题都可以随着定义使用XHTML Doctype挥之而去。


为什么要制作XHTML皮肤？

说到网页标准化(Web Standard)我想大家都应该很熟悉吧，那么制作符合网页标准化的XHTML皮肤有什么好处呢？

  • 符合标准化日后移植更加方便
  • 用户能够通过样式选择定制自己的表现界面
  • 结构更清晰，网页读取速度更快
  • 多浏览器兼容性更好

更多的优点我就不赘述了，这方面网上的资源很多。


如何制作支持XHTML的皮肤?

经过大家不断的反馈，DotNetNuke核心团队推出了一个折中的解决方案

xhtml

如上图所示，如果你要创建一个皮肤名字是contact.html 那么你需要建立一个同名的contact.doctype.xml文件注意后缀是.doctype.xml 文件的内容是 

<SkinDocType>
<![CDATA[<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
               "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">]]>
</SkinDocType>

这样DNN系统在读取这个皮肤的时候如果检测到和皮肤文件同名后缀是.doctype.xml的文件就会把这个皮肤解释为XHTML Doctype, 通过查看网页的源代码你可以看到，成功加载XHTML Doctype源代码的第一行应该是

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
               "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 

如果没有成功加载则显示HTML Doctype

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

 


DNN 5.0对XHTML的支持

在这里我们快速展望一下即将推出DNN 5.0对XHTML的支持，在Host > Host Settings > Basic Settings > Host Details 多了一个 Fallback Doctype的选项

xhtml

这其实就是选择如果皮肤本身不带Doctype系统默认的Doctype

  • HTML4 (Legacy) -------------- 如果你的系统里有很多遗留的HTML皮肤建议选择这项以防显示出问题
  • XHTML 1.0 transitional --------- 如果是新装的系统建议选择这项，默认的皮肤使用XHTML
  • XHTML 1.0 strict -------------- 这项同样是XHTML但是语法的标准过于严格暂不推荐选择

我在写这篇blog的时候做了个测试， Fallback Doctype选择XHTML 1.0 transitional把没有定义doctype的皮肤的页面打开查看源代码果不其然 默认的Doctype已经是XHTML了， DotNetNuke又向网页标准化迈进了一步！


小贴士：

在DNN 5.0中虽然可以默认使用XHTML但在制做皮肤的时候还是建议加上XHTML Doctype。 方法参考前面建立后缀为.doctype.xml的同名文件。 这么做是以防有的DNN5.0网站默认设置是HTML4 (Legacy) 及默认Doctype是HTML ，在这种网站中如果皮肤有定义后缀为.doctype.xml的同名文件， DNN系统会忽略默认设置并把它解释为正确XHTML Doctype

 

 

 

我的DNN Blog   www.dnnmix.com
DNN QQ群: 　　 74812936
DNN MSN 群:    group247485@msnzone.cn

posted @   Dnnmix  阅读(1667)  评论(0)  编辑  收藏  举报
编辑推荐：
· 如何编写易于单元测试的代码
· 10年+ .NET Coder 心语，封装的思维：从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热？
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列：向量存储与相似性搜索在 .NET 中的实现
阅读排行：
· 周边上新：园子的第一款马克杯温暖上架
· Open-Sora 2.0 重磅开源！
· 分享 3 个 .NET 开源的文件压缩处理库，助力快速实现文件压缩解压功能！
· Ollama——大语言模型本地部署的极速利器
· [AI/GPT/综述] AI Agent的设计模式综述
点击右上角即可分享
微信分享提示
AI IDE Trae