sitemap
知识分享网:一个值得你收藏的网站!
当前位置:网站首页 > Html > 使用Web标准建站第6天:XHTML代码规范

使用Web标准建站第6天:XHTML代码规范

作者:xuhongji发布时间:2020-09-12分类:Html浏览:141评论:0


导读:在开始正式内容制作之前,我们必须先了解一下web标准有关代码的规范。了解这些规范可以帮助你少走弯路,尽快通过代码校验。1.所有的标记都必须要有一个相应的结束标记以...
在开始正式内容制作之前,我们必须先了解一下web标准有关代码的规范。了解这些规范可以帮助你少走弯路,尽快通过代码校验。

1.所有的标记都必须要有一个相应的结束标记

以前在HTML中,你可以打开许多标签,例如

  • 而不一定写对应的

  • 来关闭它们。但在XHTML中这是不合法的。XHTML要求有严谨的结构,所有标签必须关闭。如果是单独不成对的标签,在标签最后加一个"/"来关闭它。例如:


    2.所有标签的元素和属性的名字都必须使用小写

      与HTML不一样,XHTML对大小写是敏感的,和<TITLE>是不同的标签。XHTML要求所有的标签和属性的名字都必须使用小写。例如:<BODY>必须写成<body> 。大小写夹杂也是不被认可的,通常Dreamweaver自动生成的属性名字"onMouSEOver"也必须修改成"onmouseover"。</p><p>3.所有的xml标记都必须合理嵌套</p><p>  同样因为XHTML要求有严谨的结构,因此所有的嵌套都必须按顺序,以前我们这样写的代码:</p><p><p><b></p>/b></p><p>  必须修改为:</p><p><p><b></b></p></p><p>  就是说,一层一层的嵌套必须是严格对称。</p><p>4.所有的属性必须用引号""括起来</p><p>  在HTML中,你可以不需要给属性值加引号,但是在XHTML中,它们必须被加引号。例如:</p><p><height=80></p><p>  必须修改为:</p><p><height="80"></p><p>  特殊情况,你需要在属性值里使用双引号,你可以用",单引号可以使用',例如:</p><p></p><p>5.把所有<和&特殊符号用编码表示</p><p>任何小于号(<),不是标签的一部分,都必须被编码为</p><p>& l t ;</p><p>任何大于号(>),不是标签的一部分,都必须被编码为</p><p>& g t ;</p><p>任何与号(&),不是实体的一部分的,都必须被编码为</p><p>& a m p;</p><p>  注:以上字符之间无空格。</p><p>6.给所有属性赋一个值</p><p>  XHTML规定所有属性都必须有一个值,没有值的就重复本身。例如:</p><p><td nowrap></p><p><input type="checkbox" name="shirt" value="medium" checked></p><p>  必须修改为:</p><p><td nowrap="nowrap"></p><p><input type="checkbox" name="shirt" value="medium" checked="checked"></p><p>7.不要在注释内容中使“--”</p><p>  “--”只能发生在XHTML注释的开头和结束,也就是说,在内容中它们不再有效。例如下面的代码是无效的:</p><p><!--这里是注释-----------这里是注释--></p><p>  用等号或者空格替换内部的虚线。</p><p><!--这里是注释============这里是注释--></p><p>  以上这些规范有的看上去比较奇怪,但这一切都是为了使我们的代码有一个统一、唯一的标准,便于以后的数据再利用。</p><p> 以上就是使用Web标准建站第6天:XHTML代码规范的内容,更多相关内容请关注PHP中文网(www.cuteur.cn)! </div> <hr class="tx-hr mb15"> <div class="info-next"> <ul class="row"> <li class="col-12 col-m-24">上一篇:<a href="https://www.cuteur.cn/post/1242.html" title="使用Web标准建站第7天:CSS入门">使用Web标准建站第7天:CSS入门</a></li> <li class="col-12 col-m-24 ta-r">下一篇:<a href="https://www.cuteur.cn/post/1244.html" title="一步步学习html----第三课">一步步学习html----第三课</a></li> </ul> </div> </div> <div class="tx-box mb15 pd15"> <h2 class="tx-title1 mb15"><strong>相关推荐</strong></h2> <ul class="ul-30 ul-arrow row"> <li class="col-12 col-m-24"><a href="https://www.cuteur.cn/post/1691.html" title="美丽的阴影(剖析jquery主页)" target="_blank">美丽的阴影(剖析jquery主页)</a></li> <li class="col-12 col-m-24"><a href="https://www.cuteur.cn/post/1690.html" title="深度解析响应式布局" target="_blank">深度解析响应式布局</a></li> <li class="col-12 col-m-24"><a href="https://www.cuteur.cn/post/1689.html" title="div浮动在页面底部" target="_blank">div浮动在页面底部</a></li> <li class="col-12 col-m-24"><a href="https://www.cuteur.cn/post/1688.html" title="响应式布局的见解" target="_blank">响应式布局的见解</a></li> <li class="col-12 col-m-24"><a href="https://www.cuteur.cn/post/1687.html" title="css3渐变(Gradients)" target="_blank">css3渐变(Gradients)</a></li> <li class="col-12 col-m-24"><a href="https://www.cuteur.cn/post/1686.html" title="Form.action传值问题" target="_blank">Form.action传值问题</a></li> <li class="col-12 col-m-24"><a href="https://www.cuteur.cn/post/1685.html" title="随机得到1-20之间的10个不相同的随机数" target="_blank">随机得到1-20之间的10个不相同的随机数</a></li> <li class="col-12 col-m-24"><a href="https://www.cuteur.cn/post/1684.html" title="javascript基础篇" target="_blank">javascript基础篇</a></li> <li class="col-12 col-m-24"><a href="https://www.cuteur.cn/post/1683.html" title="点击div折叠" target="_blank">点击div折叠</a></li> <li class="col-12 col-m-24"><a href="https://www.cuteur.cn/post/1682.html" title="Chrome浏览器Network面板http请求时间分析" target="_blank">Chrome浏览器Network面板http请求时间分析</a></li> </ul> </div> <div class="tx-box mb15 pd15"> <div class="tx-comments bg-white"> <label id="AjaxCommentBegin"></label> <label id="AjaxCommentEnd"></label> </div> <!--评论框--> <div class="tx-comment" id="divCommentPost"> <h3 class="f-18 mb10"><a name="comment" rel="nofollow" id="cancel-reply" href="#divCommentPost" style="display:none;float:right;"><small>取消回复</small></a>欢迎 <span class="f-red">你</span> 发表评论:</h3> <ul class="row2"> <form id="frmSumbit" target="_self" method="post" action="https://www.cuteur.cn/zb_system/cmd.php?act=cmt&postid=1243&key=d5716410b438d01da41478e9a90474fa" class="clearfix"> <input type="hidden" name="inpId" id="inpId" value="1243"> <input type="hidden" name="inpRevID" id="inpRevID" value="0"> <li class="col-8 col-m-24 col2- mb10"><input type="text" name="inpName" id="inpName" class="tx-input" value="访客" size="28" tabindex="1" placeholder="名称(*)"> </li> <li class="col-8 col-m-24 col2- mb10"><input type="text" name="inpEmail" id="inpEmail" class="tx-input" value="" size="28" tabindex="2" placeholder="邮箱"></li> <li class="col-8 col-m-24 col2- mb10"><input type="text" name="inpHomePage" id="inpHomePage" class="tx-input" value="" size="28" tabindex="3" placeholder="网站"></li> <li class="col-24 col-m-24 col2-"> <div class="tx-comment-textarea clearfix"> <textarea name="txaArticle" id="txaArticle" class="tx-textarea" cols="50" rows="4" tabindex="5" placeholder="欢迎你的交流评论,但是垃圾评论不受欢迎"></textarea> <input name="sumbit" type="submit" tabindex="6" value="提交评论" onclick="return zbp.comment.post()" class="tx-btn tx-bg"> </div> </li> </form> </ul> </div> </div> </div> <div class="tx-side col-7 col-m-24 col1-"> <dl> <dt>Html排行</dt> <dd> <ul class="ul-33 ul-rank"> <li><span>1</span><a href="https://www.cuteur.cn/post/1541.html" title="CSS浮动设置与清除" target="_blank">CSS浮动设置与清除</a></li> <li><span>2</span><a href="https://www.cuteur.cn/post/1689.html" title="div浮动在页面底部" target="_blank">div浮动在页面底部</a></li> <li><span>3</span><a href="https://www.cuteur.cn/post/1686.html" title="Form.action传值问题" target="_blank">Form.action传值问题</a></li> <li><span>4</span><a href="https://www.cuteur.cn/post/725.html" title="介绍2个伪类选择器:E:nth-child(n)和E:nth-of-type(n)" target="_blank">介绍2个伪类选择器:E:nth-child(n)和E:nth-of-type(n)</a></li> <li><span>5</span><a href="https://www.cuteur.cn/post/1691.html" title="美丽的阴影(剖析jquery主页)" target="_blank">美丽的阴影(剖析jquery主页)</a></li> <li><span>6</span><a href="https://www.cuteur.cn/post/1688.html" title="响应式布局的见解" target="_blank">响应式布局的见解</a></li> <li><span>7</span><a href="https://www.cuteur.cn/post/1684.html" title="javascript基础篇" target="_blank">javascript基础篇</a></li> <li><span>8</span><a href="https://www.cuteur.cn/post/1685.html" title="随机得到1-20之间的10个不相同的随机数" target="_blank">随机得到1-20之间的10个不相同的随机数</a></li> <li><span>9</span><a href="https://www.cuteur.cn/post/1690.html" title="深度解析响应式布局" target="_blank">深度解析响应式布局</a></li> </ul> </dd> </dl> <dl class="function" id="divCalendar"> <dt style="display:none;"></dt><dd class="function_c"> <div><table id="tbCalendar"> <caption><a href="https://www.cuteur.cn/date-2020-12.html">«</a>   <a href="https://www.cuteur.cn/date-2021-1.html">2021年1月</a>   <a href="https://www.cuteur.cn/date-2021-2.html">»</a></caption> <thead><tr> <th title="星期一" scope="col"><small>一</small></th> <th title="星期二" scope="col"><small>二</small></th> <th title="星期三" scope="col"><small>三</small></th> <th title="星期四" scope="col"><small>四</small></th> <th title="星期五" scope="col"><small>五</small></th> <th title="星期六" scope="col"><small>六</small></th> <th title="星期日" scope="col"><small>日</small></th></tr></thead> <tbody> <tr> <td class="pad" colspan="4"></td><td>1</td><td>2</td><td>3</td></tr><tr><td>4</td><td>5</td><td>6</td><td>7</td><td>8</td><td>9</td><td>10</td></tr><tr><td>11</td><td>12</td><td>13</td><td>14</td><td>15</td><td>16</td><td>17</td></tr><tr><td>18</td><td>19</td><td>20</td><td>21</td><td>22</td><td>23</td><td>24</td></tr><tr><td>25</td><td>26</td><td>27</td><td>28</td><td>29</td><td>30</td><td>31</td></tr><tr> </tr></tbody> </table></div> </dd> </dl><dl class="function" id="divTags"> <dt class="function_t">标签列表</dt><dd class="function_c"> <ul><li><a href="https://www.cuteur.cn/tags-eval%E5%87%BD%E6%95%B0.html">eval函数<span class="tag-count"> (1)</span></a></li> <li><a href="https://www.cuteur.cn/tags-PHP%E6%A0%BC%E5%BC%8F%E5%8C%96.html">PHP格式化<span class="tag-count"> (1)</span></a></li> <li><a href="https://www.cuteur.cn/tags-MYSQL.html">MYSQL<span class="tag-count"> (1)</span></a></li> <li><a href="https://www.cuteur.cn/tags-Bootstrap%E5%8D%95%E9%80%89%E6%A1%86.html">Bootstrap单选框<span class="tag-count"> (1)</span></a></li> <li><a href="https://www.cuteur.cn/tags-php%E5%AE%9E%E4%BE%8B.html">php实例<span class="tag-count"> (1)</span></a></li> <li><a href="https://www.cuteur.cn/tags-php%E9%98%B2%E6%B3%A8%E5%85%A5.html">php防注入<span class="tag-count"> (1)</span></a></li> <li><a href="https://www.cuteur.cn/tags-PHP%E6%8D%A2%E8%A1%8C%E7%AC%A6.html">PHP换行符<span class="tag-count"> (1)</span></a></li> <li><a href="https://www.cuteur.cn/tags-PHP%E5%88%86%E9%A1%B5.html">PHP分页<span class="tag-count"> (1)</span></a></li> <li><a href="https://www.cuteur.cn/tags-CSS3%E6%96%87%E5%AD%97%E9%98%B4%E5%BD%B1.html">CSS3文字阴影<span class="tag-count"> (1)</span></a></li> <li><a href="https://www.cuteur.cn/tags-json%E8%BD%AC%E6%8D%A2.html">json转换<span class="tag-count"> (1)</span></a></li> <li><a href="https://www.cuteur.cn/tags-css%E4%B8%8B%E6%8B%89%E8%8F%9C%E5%8D%95.html">css下拉菜单<span class="tag-count"> (1)</span></a></li> <li><a href="https://www.cuteur.cn/tags-python%E5%AE%89%E8%A3%85.html">python安装<span class="tag-count"> (1)</span></a></li> <li><a href="https://www.cuteur.cn/tags-self%E5%8F%82%E6%95%B0.html">self参数<span class="tag-count"> (1)</span></a></li> <li><a href="https://www.cuteur.cn/tags-PHPCURL.html">PHPCURL<span class="tag-count"> (1)</span></a></li> <li><a href="https://www.cuteur.cn/tags-%E7%BD%91%E9%A1%B5%E8%A1%A8%E5%8D%95.html">网页表单<span class="tag-count"> (1)</span></a></li> <li><a href="https://www.cuteur.cn/tags-php%E9%80%92%E5%BD%92.html">php递归<span class="tag-count"> (1)</span></a></li> <li><a href="https://www.cuteur.cn/tags-php%E9%80%92%E5%BD%92%E7%9B%AE%E5%BD%95.html">php递归目录<span class="tag-count"> (1)</span></a></li> <li><a href="https://www.cuteur.cn/tags-%E5%93%8D%E5%BA%94%E5%BC%8F%E5%AF%BC%E8%88%AA.html">响应式导航<span class="tag-count"> (1)</span></a></li> <li><a href="https://www.cuteur.cn/tags-php%E6%97%A5%E6%9C%9F%E5%87%BD%E6%95%B0.html">php日期函数<span class="tag-count"> (1)</span></a></li> </ul> </dd> </dl><dl class="function" id="divCatalog"> <dt class="function_t">网站分类</dt><dd class="function_c"> <ul><li class="li-cate"><a href="https://www.cuteur.cn/category-mysql.html">mysql</a><ul class="ul-subcates"><li class="li-subcate"><a href="https://www.cuteur.cn/category-mysql基础教程.html">mysql基础教程</a></li></ul></li><li class="li-cate"><a href="https://www.cuteur.cn/category-php.html">php</a><ul class="ul-subcates"><li class="li-subcate"><a href="https://www.cuteur.cn/category-php基础教程.html">php基础教程</a></li></ul></li><li class="li-cate"><a href="https://www.cuteur.cn/category-python.html">python</a><ul class="ul-subcates"><li class="li-subcate"><a href="https://www.cuteur.cn/category-python3基础教程.html">python3基础教程</a></li></ul></li><li class="li-cate"><a href="https://www.cuteur.cn/category-bootstrap.html">bootstrap</a><ul class="ul-subcates"><li class="li-subcate"><a href="https://www.cuteur.cn/category-Bootstrap基础教程.html">Bootstrap基础教程</a></li></ul></li><li class="li-cate"><a href="https://www.cuteur.cn/category-Html.html">Html</a><ul class="ul-subcates"><li class="li-subcate"><a href="https://www.cuteur.cn/category-html基础教程.html">html基础教程</a></li></ul></li><li class="li-cate"><a href="https://www.cuteur.cn/category-JavaScript.html">JavaScript</a><ul class="ul-subcates"><li class="li-subcate"><a href="https://www.cuteur.cn/category-JavaScript基础教程.html">JavaScript基础教程</a></li></ul></li><li class="li-cate"><a href="https://www.cuteur.cn/category-CSS基础教程.html">CSS基础教程</a></li><li class="li-cate"><a href="https://www.cuteur.cn/category-CSS3教程.html">CSS3教程</a></li></ul> </dd> </dl><dl class="function" id="divArchives"> <dt class="function_t">文章归档</dt><dd class="function_c"> <ul><li><a href="https://www.cuteur.cn/date-2020-11.html">2020年11月 (11)</a></li> <li><a href="https://www.cuteur.cn/date-2020-10.html">2020年10月 (2)</a></li> <li><a href="https://www.cuteur.cn/date-2020-9.html">2020年9月 (1035)</a></li> <li><a href="https://www.cuteur.cn/date-2020-8.html">2020年8月 (115)</a></li> <li><a href="https://www.cuteur.cn/date-2020-7.html">2020年7月 (446)</a></li> </ul> </dd> </dl><dl class="function" id="divPrevious"> <dt class="function_t">最近发表</dt><dd class="function_c"> <ul><li><a href="https://www.cuteur.cn/post/1704.html">PHP的Mcrypt加密扩展知识了解</a></li> <li><a href="https://www.cuteur.cn/post/1703.html">PHP的Mhash扩展函数的学习</a></li> <li><a href="https://www.cuteur.cn/post/1702.html">PHP的OpenSSL加密扩展学习(一):对称加密</a></li> <li><a href="https://www.cuteur.cn/post/1701.html">PHP的OpenSSL加密扩展学习(二):非对称加密</a></li> <li><a href="https://www.cuteur.cn/post/1700.html">PHP的OpenSSL加密扩展学习(三):证书操作</a></li> <li><a href="https://www.cuteur.cn/post/1699.html">PHP的rar解压读取扩展包学习</a></li> <li><a href="https://www.cuteur.cn/post/1698.html">PHP的zip压缩工具扩展包学习</a></li> <li><a href="https://www.cuteur.cn/post/1697.html">PHP的zlib压缩工具扩展包学习</a></li> <li><a href="https://www.cuteur.cn/post/1696.html">PHP密码散列算法的学习</a></li> <li><a href="https://www.cuteur.cn/post/1695.html">学习PDO中的错误与错误处理模式</a></li> </ul> </dd> </dl> <dl class="function" > <dt class="function_t">推荐文章</dt><dd class="function_c"> <ul> <li><a href="https://www.cuteur.cn/post/1582.html" title="移动端H5-第一课css篇">移动端H5-第一课css篇</a></li> <li><a href="https://www.cuteur.cn/post/1616.html" title="CSSPosition定位">CSSPosition定位</a></li> <li><a href="https://www.cuteur.cn/post/1660.html" title="中软培训第一周复习总结--简单的HTML与CSS">中软培训第一周复习总结--简单的HTML与CSS</a></li> <li><a href="https://www.cuteur.cn/post/1561.html" title="reset.css(详细说明)">reset.css(详细说明)</a></li> <li><a href="https://www.cuteur.cn/post/715.html" title="使用PHP程序清除html代码">使用PHP程序清除html代码</a></li> <li><a href="https://www.cuteur.cn/post/1657.html" title="String字符串对象">String字符串对象</a></li> </ul> </dd> </dl> </div> </div> </div> <div class="footer tx-box ta-c f-12"> <div class="wide1"> <div class="nav mb15"> <ul class="wide"> <li class="navbar-item"><a href="https://www.cuteur.cn/" title="">首页</a></li><li class="navbar-item"><a href="https://www.cuteur.cn/category-php.html" title="">php</a></li><li class="navbar-item"><a href="https://www.cuteur.cn/category-mysql.html" title="">mysql</a></li><li class="navbar-item"><a href="https://www.cuteur.cn/category-python.html" title="">python</a></li><li class="navbar-item"><a href="https://www.cuteur.cn/category-Html.html" title="">Html</a></li><li class="navbar-item"><a href="https://www.cuteur.cn/category-JavaScript.html" title="">JavaScript</a></li><li class="navbar-item"><a href="https://www.cuteur.cn/category-bootstrap.html" title="">bootstrap</a></li> </ul> </div> </div> </div> <script src="https://www.cuteur.cn/zb_users/theme/tx_freecms/script/txcstx.js"></script> <script src="https://pv.sohu.com/cityjson?ie=utf-8"></script> <script src="https://www.cuteur.cn/zb_users/theme/tx_freecms/script/vue.js"></script> <!-- <script src="https://www.cuteur.cn/zb_users/theme/tx_freecms/script/materialize.min.js"></script> --> <div id="rightClickMenu"> <ul class="list-group" style="margin: 0"> <li class="list-group-item disabled" style="text-align: center; line-height: 50px; border-bottom: 1px #ddd solid;"> 欢迎访问我的博客 </li> <li class="list-group-item" style="border-bottom: 1px #ddd solid;">  IP:<span id="client-ip">127.0.0.1</span></li> <li class="list-group-item" style="border-bottom: 1px #ddd solid;">  地址:<span id="client-location">本地</span></li> <li class="list-group-item" style="border-bottom: 1px #ddd solid;">  系统:<span id="client-os">Windows10</span></li> <li class="list-group-item">  浏览器:<span id="client-browser">Chrome47</span></li> </ul> </div> <script> (function() { var url=document.location.href; $.ajax({ url: 'https://www.cuteur.cn/apidijiao.php', type: 'POST', data: {url:url}, dataType: 'JSON', success:function (data) { console.log(data) }, error:function () { console.log("错误") } }); })(); </script> <script> (function(){ var bp = document.createElement('script'); var curProtocol = window.location.protocol.split(':')[0]; if (curProtocol === 'https') { bp.src = 'https://zz.bdstatic.com/linksubmit/push.js'; } else { bp.src = 'http://push.zhanzhang.baidu.com/push.js'; } var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(bp, s); })(); </script> <style> #rightClickMenu { display:none; position: fixed; z-index: 99999; background-color: #fff; opacity: 1; width: 180px; height: 200px; border-radius: 10px; } #rightClickMenu>ul>li { cursor: pointer; line-height: 36px } #rightClickMenu>ul>li>span { width: 65px } #rightClickMenu>ul>li.rightClickMenuActive { color: #39c } #rightClickMenu>ul>li.disabled { cursor: no-drop; color: #666 } </style> </body> </html><!--1,930.93 ms , 21 query , -791kb memory , 0 error-->