HTML - XHTML
admin2024-08-15 14:25:34HTML教程
HTML - XHTML
XHTML 是以 XML 格式编写的 HTML。
什么是 XHTML?
XHTML 指的是可扩展超文本标记语言
XHTML 与 HTML 4.01 几乎是相同的
XHTML 是更严格更纯净的 HTML 版本
XHTML 是以 XML 应用的方式定义的 HTML
XHTML 是 2001 年 1 月发布的 W3C 推荐标准
XHTML 得到所有主流浏览器的支持
为什么使用 XHTML?
因特网上的很多页面包含了"糟糕"的 HTML。
如果在浏览器中查看，下面的 HTML 代码运行起来非常正常（即使它并未遵守 HTML 规则）：
<html>
<head>
<meta charset="utf-8">
<title>这是一个不规范的 HTMLtitle>
<body>
<h1>不规范的 HTML
<p>这是一个段落
body>
XML 是一种必须正确标记且格式良好的标记语言。
如果希望学习 XML，请阅读我们的 XML 教程。
今日的科技界存在一些不同的浏览器技术。其中一些在计算机上运行，而另一些可能在移动电话或其他小型设备上运行。小型设备往往缺乏解释"糟糕"的标记语言的资源和能力。
所以 - 通过结合 XML 和 HTML 的长处，开发出了 XHTML。XHTML 是作为 XML 被重新设计的 HTML。
与 HTML 相比最重要的区别：
文档结构
XHTML DOCTYPE 是强制性的
中的 XML namespace 属性是强制性的
、、 以及 <body> 也是<em>强制性的</em>
<h3>元素语法</h3>
XHTML 元素必须<em>正确嵌套</em>
XHTML 元素必须始终<em>关闭</em>
XHTML 元素必须<em>小写</em>
XHTML 文档必须有<em>一个根元素</em>
<h3>属性语法</h3>
XHTML 属性必须使用<em>小写</em>
XHTML 属性值必须用<em>引号包围</em>
XHTML 属性最小化也是<em>禁止的</em>
<hr>
<h2><!DOCTYPE ....>是强制性的</h2>
<p>XHTML 文档必须进行 XHTML 文档类型声明（XHTML DOCTYPE declaration）。</p>
<p>您可以在菜鸟教程的标签参考手册中找到完整的 XHTML 文档类型。</p>
<p><html>, <head>, <title>, 和 <body> 元素也必须存在，并且必须使用 <html> 中的 xmlns 属性为文档规定 xml 命名空间。</p>
<p>下面的例子展示了带有最少的必需标签的 XHTML 文档：</p>
<span class="hl-brackets"><</span><span class="hl-code">!</span><span class="hl-var">DOCTYPE</span><span class="hl-code"> </span><span class="hl-var">html</span><span class="hl-code"> </span><span class="hl-var">PUBLIC</span><span class="hl-code"> </span><span class="hl-quotes">"</span><span class="hl-string">-//W3C//DTD XHTML 1.0 Transitional//EN</span><span class="hl-quotes">"</span><span class="hl-code">
</span><span class="hl-quotes">"</span><span class="hl-string">http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd</span><span class="hl-quotes">"</span><span class="hl-brackets">></span><span class="hl-code">
</span><span class="hl-brackets"><</span><span class="hl-reserved">html</span><span class="hl-code"> </span><span class="hl-var">xmlns</span><span class="hl-code">=</span><span class="hl-quotes">"</span><span class="hl-string">http://www.w3.org/1999/xhtml</span><span class="hl-quotes">"</span><span class="hl-brackets">></span><span class="hl-code">
</span><span class="hl-brackets"><</span><span class="hl-reserved">head</span><span class="hl-brackets">></span><span class="hl-code">
</span><span class="hl-brackets"><</span><span class="hl-reserved">meta</span><span class="hl-code"> </span><span class="hl-var">charset</span><span class="hl-code">=</span><span class="hl-quotes">"</span><span class="hl-string">utf-8</span><span class="hl-quotes">"</span><span class="hl-brackets">></span><span class="hl-code">
</span><span class="hl-brackets"><</span><span class="hl-reserved">title</span><span class="hl-brackets">></span><span class="hl-code">文档标题</span><span class="hl-brackets"></</span><span class="hl-reserved">title</span><span class="hl-brackets">></span><span class="hl-code">
</span><span class="hl-brackets"></</span><span class="hl-reserved">head</span><span class="hl-brackets">></span><span class="hl-code">
</span><span class="hl-brackets"><</span><span class="hl-reserved">body</span><span class="hl-brackets">></span><span class="hl-code">
文档内容
</span><span class="hl-brackets"></</span><span class="hl-reserved">body</span><span class="hl-brackets">></span><span class="hl-code">
</span><span class="hl-brackets"></</span><span class="hl-reserved">html</span><span class="hl-brackets">></span>
<br><hr>
<h2>XHTML 元素必须合理嵌套</h2>
<p>在 HTML 中，一些元素可以不互相嵌套，像这样：</p>
<span class="hl-brackets"><</span><span class="hl-reserved">b</span><span class="hl-brackets">></span><span class="hl-brackets"><</span><span class="hl-reserved">i</span><span class="hl-brackets">></span><span class="hl-code">粗体和斜体文本</span><span class="hl-brackets"></</span><span class="hl-reserved">b</span><span class="hl-brackets">></span><span class="hl-brackets"></</span><span class="hl-reserved">i</span><span class="hl-brackets">></span>
<p>在 XHTML 中，所有的元素都必须互相合理地嵌套，像这样：</p>
<span class="hl-brackets"><</span><span class="hl-reserved">b</span><span class="hl-brackets">></span><span class="hl-brackets"><</span><span class="hl-reserved">i</span><span class="hl-brackets">></span><span class="hl-code">粗体和斜体文本</span><span class="hl-brackets"></</span><span class="hl-reserved">i</span><span class="hl-brackets">></span><span class="hl-brackets"></</span><span class="hl-reserved">b</span><span class="hl-brackets">></span>
<br><hr>
<h2>XHTML 元素必须有关闭标签</h2>
<p>错误示例：</p>
<span class="hl-brackets"><</span><span class="hl-reserved">p</span><span class="hl-brackets">></span><span class="hl-code">这是一个段落
</span><span class="hl-brackets"><</span><span class="hl-reserved">p</span><span class="hl-brackets">></span><span class="hl-code">这是另外一个段落</span>
<p>正确示例：</p>
<span class="hl-brackets"><</span><span class="hl-reserved">p</span><span class="hl-brackets">></span><span class="hl-code">这是一个段落</span><span class="hl-brackets"></</span><span class="hl-reserved">p</span><span class="hl-brackets">></span><span class="hl-code">
</span><span class="hl-brackets"><</span><span class="hl-reserved">p</span><span class="hl-brackets">></span><span class="hl-code">这是另外一个段落</span><span class="hl-brackets"></</span><span class="hl-reserved">p</span><span class="hl-brackets">></span>
<br><hr>
<h2>空元素必须包含关闭标签</h2>
<p>错误示例：</p>
<span class="hl-code">分行:</span><span class="hl-brackets"><</span><span class="hl-reserved">br</span><span class="hl-brackets">></span><span class="hl-code">
水平线: </span><span class="hl-brackets"><</span><span class="hl-reserved">hr</span><span class="hl-brackets">></span><span class="hl-code">
图片: </span><span class="hl-brackets"><</span><span class="hl-reserved">img</span><span class="hl-code"> </span><span class="hl-var">src</span><span class="hl-code">=</span><span class="hl-quotes">"</span><span class="hl-string">happy.gif</span><span class="hl-quotes">"</span><span class="hl-code"> </span><span class="hl-var">alt</span><span class="hl-code">=</span><span class="hl-quotes">"</span><span class="hl-string">Happy face</span><span class="hl-quotes">"</span><span class="hl-brackets">></span>
<p>正确示例：</p>
<span class="hl-code">分行:</span><span class="hl-brackets"><</span><span class="hl-reserved">br</span><span class="hl-code"> </span><span class="hl-brackets">/></span><span class="hl-code">
水平线: </span><span class="hl-brackets"><</span><span class="hl-reserved">hr</span><span class="hl-code"> </span><span class="hl-brackets">/></span><span class="hl-code">
图片: </span><span class="hl-brackets"><</span><span class="hl-reserved">img</span><span class="hl-code"> </span><span class="hl-var">src</span><span class="hl-code">=</span><span class="hl-quotes">"</span><span class="hl-string">happy.gif</span><span class="hl-quotes">"</span><span class="hl-code"> </span><span class="hl-var">alt</span><span class="hl-code">=</span><span class="hl-quotes">"</span><span class="hl-string">Happy face</span><span class="hl-quotes">"</span><span class="hl-code"> </span><span class="hl-brackets">/></span>
<br><hr>
<h2>XHTML 元素必须是小写</h2>
<p>错误示例:</p>
<span class="hl-brackets"><</span><span class="hl-reserved">BODY</span><span class="hl-brackets">></span><span class="hl-code">
</span><span class="hl-brackets"><</span><span class="hl-reserved">P</span><span class="hl-brackets">></span><span class="hl-code">这是一个段落</span><span class="hl-brackets"></</span><span class="hl-reserved">P</span><span class="hl-brackets">></span><span class="hl-code">
</span><span class="hl-brackets"></</span><span class="hl-reserved">BODY</span><span class="hl-brackets">></span>
<p>正确示例：</p>
<span class="hl-brackets"><</span><span class="hl-reserved">body</span><span class="hl-brackets">></span><span class="hl-code">
</span><span class="hl-brackets"><</span><span class="hl-reserved">p</span><span class="hl-brackets">></span><span class="hl-code">这是一个段落</span><span class="hl-brackets"></</span><span class="hl-reserved">p</span><span class="hl-brackets">></span><span class="hl-code">
</span><span class="hl-brackets"></</span><span class="hl-reserved">body</span><span class="hl-brackets">></span>
<br><hr>
<h2>属性名称必须是小写</h2>
<p>错误示例：</p>
<span class="hl-brackets"><</span><span class="hl-reserved">table</span><span class="hl-code"> </span><span class="hl-var">WIDTH</span><span class="hl-code">=</span><span class="hl-quotes">"</span><span class="hl-string">100%</span><span class="hl-quotes">"</span><span class="hl-brackets">></span>
<p>正确示例:</p>
<span class="hl-brackets"><</span><span class="hl-reserved">table</span><span class="hl-code"> </span><span class="hl-var">width</span><span class="hl-code">=</span><span class="hl-quotes">"</span><span class="hl-string">100%</span><span class="hl-quotes">"</span><span class="hl-brackets">></span>
<br><hr>
<h2>属性值必须有引号</h2>
<p>错误示例：</p>
<span class="hl-brackets"><</span><span class="hl-reserved">table</span><span class="hl-code"> </span><span class="hl-var">width</span><span class="hl-code">=</span><span class="hl-var">100</span><span class="hl-code">%</span><span class="hl-brackets">></span>
<p>正确示例：</p>
<span class="hl-brackets"><</span><span class="hl-reserved">table</span><span class="hl-code"> </span><span class="hl-var">width</span><span class="hl-code">=</span><span class="hl-quotes">"</span><span class="hl-string">100%</span><span class="hl-quotes">"</span><span class="hl-brackets">></span>
<br><hr>
<h2>不允许属性简写</h2>
<p>错误示例：</p>
<span class="hl-brackets"><</span><span class="hl-reserved">input</span><span class="hl-code"> </span><span class="hl-var">checked</span><span class="hl-brackets">></span><span class="hl-code">
</span><span class="hl-brackets"><</span><span class="hl-reserved">input</span><span class="hl-code"> </span><span class="hl-var">readonly</span><span class="hl-brackets">></span><span class="hl-code">
</span><span class="hl-brackets"><</span><span class="hl-reserved">input</span><span class="hl-code"> </span><span class="hl-var">disabled</span><span class="hl-brackets">></span><span class="hl-code">
</span><span class="hl-brackets"><</span><span class="hl-reserved">option</span><span class="hl-code"> </span><span class="hl-var">selected</span><span class="hl-brackets">></span>
<p>正确示例：</p>
<span class="hl-brackets"><</span><span class="hl-reserved">input</span><span class="hl-code"> </span><span class="hl-var">checked</span><span class="hl-code">=</span><span class="hl-quotes">"</span><span class="hl-string">checked</span><span class="hl-quotes">"</span><span class="hl-brackets">></span><span class="hl-code">
</span><span class="hl-brackets"><</span><span class="hl-reserved">input</span><span class="hl-code"> </span><span class="hl-var">readonly</span><span class="hl-code">=</span><span class="hl-quotes">"</span><span class="hl-string">readonly</span><span class="hl-quotes">"</span><span class="hl-brackets">></span><span class="hl-code">
</span><span class="hl-brackets"><</span><span class="hl-reserved">input</span><span class="hl-code"> </span><span class="hl-var">disabled</span><span class="hl-code">=</span><span class="hl-quotes">"</span><span class="hl-string">disabled</span><span class="hl-quotes">"</span><span class="hl-brackets">></span><span class="hl-code">
</span><span class="hl-brackets"><</span><span class="hl-reserved">option</span><span class="hl-code"> </span><span class="hl-var">selected</span><span class="hl-code">=</span><span class="hl-quotes">"</span><span class="hl-string">selected</span><span class="hl-quotes">"</span><span class="hl-brackets">></span>
<br><hr>
<h2>如何将 HTML 转换为 XHTML</h2>
添加一个 XHTML <!DOCTYPE> 到你的网页中
添加 xmlns 属性添加到每个页面的html元素中。
改变所有的元素为小写
关闭所有的空元素
修改所有的属性名称为小写
所有属性值添加引号
<hr>
<h2>使用 W3C 验证器来测试你的 XHTML</h2>
<form method="get" action="https://validator.w3.org/check" target="_blank">
<p>请在下面的输入框中输入您的网址：</p>
<p><input name="uri" size="60" value="https://www.runoob.com"></p>
<input type="submit" value="页面验证"></form>
</form>
<!-- 其他扩展 -->
</div>
<footer class="entry-meta">
<p id="tag-wrap" class="tag-wrap">
<i class="fa fa-tags"></i> 标签： </p>
<div class="clear"></div>
</footer>
<div class="authorbio">
<ul class="spostinfo">
<li><strong>声明：</strong>本站内容均来自互联网，如果侵犯了您的权益请与我们联系，我们将在24小时内删除。</li>
<li><strong>本文地址：</strong><a href="http://www.humeup.cn/HTML/1869.html" title="">http://www.humeup.cn/HTML/1869.html</a></li>
</ul>
</div>
</div>
</div>
<div class="article">
<div class="article-container">
<div class="post-navigation">
<div class="post-previous"><span class="prev">上一篇</span><a href="/HTML/1868.html">HTML5 简介</a></div>
<div class="post-next"><span class="next">下一篇</span><a href="/HTML/1870.html">你已经完成了 HTML 的学习，下一步该学习什么呢？
</a></div>
</div>
</div>
</div>
<div class="article">
<div class="article-container">
<div class="relates">
<div class="title">
<h3>相关文章</h3>
</div>
<div id="related-img">
<ul id="related">
</ul>
<div class="clear"> </div>
</div>
</div>
</div>
</div>
</div>
<aside class="sidebar" id="sidebar">
<dl class="function" id="side-adimg">
<dt class="function_t">广告</dt>
<dd class="function_c">
<a href="https://t.aliyun.com/U/oTpGxp" target="_blank"><img src="/static/v1/pc/images/aliyun.jpg" alt="【阿里云】云服务器u1-实例2核4G 80G，新人专享渠道特惠价只要199元！特惠热卖中。 点击【 https://t.aliyun.com/U/oTpGxp 】立即购买"></a>
</dd>
</dl>
<dl class="function" id="side-tui-article-item">
<dt class="function_t">热门阅读</dt>
<dd class="function_c">
<div>
<article><a href="/douyin/2470.html" class="image"><img src="/static/assets/images/10.jpg" alt="瞄准小学生，品牌靠几十元单品月入5千万！"></a>
<h3><a href="/douyin/2470.html">瞄准小学生，品牌靠几十元单品月入5千万！</a></h3>
</article>
<article><a href="/douyin/2450.html" class="image"><img src="/static/assets/images/13.jpg" alt="抖音爆款脚本拆解.pdf(抖音脚本模板)"></a>
<h3><a href="/douyin/2450.html">抖音爆款脚本拆解.pdf(抖音脚本模板)</a></h3>
</article>
<article><a href="/douyin/2449.html" class="image"><img src="/static/assets/images/14.jpg" alt="抖音完整运营玩法.ppt！(抖音企业运营方案ppt)"></a>
<h3><a href="/douyin/2449.html">抖音完整运营玩法.ppt！(抖音企业运营方案ppt)</a></h3>
</article>
<article><a href="/douyin/2448.html" class="image"><img src="/static/assets/images/4.jpg" alt="抖音起号指南.pdf"></a>
<h3><a href="/douyin/2448.html">抖音起号指南.pdf</a></h3>
</article>
</div>
</dd>
</dl>
<dl class="function" id="side-adimg">
<dt class="function_t">广告</dt>
<dd class="function_c">
<a href="https://www.aliyun.com/daily-act/ecs/activity_selection?userCode=vgt859tn" target="_blank"><img src="/static/v1/pc/images/aliyun2.jpg" alt="【阿里云】云服务器u1-实例2核4G 80G，新人专享渠道特惠价只要199元！特惠热卖中。 点击【 https://t.aliyun.com/U/oTpGxp 】立即购买"></a>
</dd>
</dl>
<dl class="function" id="divTags">
<dt class="function_t">标签列表</dt>
<dd class="function_c">
<ul>
<li><a href="/tag/2024nianjuminyibaojiaofeibiaozhunshiduoshao.html">2024年居民医保缴费标准是多少</a></li>
<li><a href="/index.php?s=tag&name=win8">WIN8</a></li>
<li><a href="/index.php?s=tag&name=win10">WIN10</a></li>
<li><a href="/index.php?s=tag&name=win7">WIN7</a></li>
<li><a href="/tag/fuzhoushidianzishangwu.html">福州市电子商务</a></li>
<li><a href="/tag/fuzhoushishangwuju.html">福州市商务局</a></li>
<li><a href="/tag/2024nianjuminyibaojiaofeibiaozhun.html">2024年居民医保缴费标准</a></li>
<li><a href="/tag/heishenhuawukongguanwang.html">黑神话悟空官网</a></li>
<li><a href="/index.php?s=tag&name=shujuku">数据库</a></li>
<li><a href="/tag/steam.html">Steam</a></li>
<li><a href="/tag/heishenhua:wukong.html">黑神话:悟空</a></li>
<li><a href="/index.php?s=tag&name=mysql">mysql</a></li>
<li><a href="/tag/xiaohongshuyinliu.html">小红书引流</a></li>
<li><a href="/index.php?s=tag&name=win12">WIN12</a></li>
<li><a href="/tag/xiaohongshu.html">小红书</a></li>
</ul>
</dd>
</dl>
<dl class="function" id="divLinkage">
<dt class="function_t">友情链接</dt>
<dd class="function_c">
<ul>
<li><a href="http://gas.humeup.cn?ref=www.humeup.cn" target="_blank">今日油价</a></li><li><a href="http://www.zmbug.com?ref=www.humeup.cn" target="_blank">黄金在线</a></li> </ul>
</dd>
</dl>
</aside></main>
<footer class="footer-box">
<div class="footer-bottom">
<div class="container">
<div class="row">
<div class="col-md-12 align-center">
<p> <span><a href="/jsjc/" title="技术教程">技术教程</a></span><span><a href="/baike/" title="知识百科">知识百科</a></span><span><a href="/gonglue/" title="游戏攻略">游戏攻略</a></span><span><a href="/yuanma/" title="源码模版">源码模版</a></span><span><a href="/news/" title="今日资讯">今日资讯</a></span><span><a href="/jianzhan/" title="建站教程">建站教程</a></span><span><a href="/wlyy/" title="网络运营">网络运营</a></span> <p>Copyright © <span>2024 © 汇美优普</span><span><a href="https://beian.miit.gov.cn/" target="_blank" rel="nofollow">闽ICP备09041570号 </a></span> <span><a href="/sitemap.xml" target="_blank">XML地图</a></span> </p>
</div>
</div>
</div>
</div>
</footer>
<div id="topcontrol" title="返回顶部"><i class="fa fa-angle-up"></i></div>
<div id="mask" style="display: none;"></div>
<script src="/static/v1/pc/js/main.js"></script>
<script src="/static/v1/pc/js/navigation.js"></script>
<script src="/static/v1/pc/js/side.js"></script>
<script src="/static/v1/pc/js/qrcode.min.js"></script>
<div style='display:none'>
</div>
</body>
</html>
