您所在的位置:首页 > 新闻动态 > 正文

WEB2.0标准教程:第六天 XHTML代码规范

来源:黑马培训 日期:2013-11-23 人气:468

在开始正式内容制作之前,我们必须先了解一下web标准有关代码的规范。
了解这些规范可以帮助你少走弯路,尽快通过代码校验。使我们的代码有一个统一、唯一的标准!

1.所有的标记都必须要有一个相应的结束标记
以前在HTML中,你可以打开许多标签,例如

  • 而不一定写对应的

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

    2.所有标签的元素和属性的名字都必须使用小写
    与HTML不一样,XHTML对大小写是敏感的,和<TITLE>是不同的标签。XHTML要求所有的标签和属性的名字都必须使用小写。例如:<BODY>必须写成<body> 。大小写夹杂也是不被认可的,通常dreamweaver自动生成的属性名字"onMouseOver"也必须修改成"onmouseover"。<br /> <br /> <strong>3.所有的XML标记都必须合理嵌套</strong><br /> 同样因为XHTML要求有严谨的结构,因此所有的嵌套都必须按顺序,以前我们这样写的代码:<br /> <span style="color: red"><p><b></p></b> </span><br /> 必须修改为:<br /> <span style="color: red"><p><b></b></p> </span><br /> 就是说,一层一层的嵌套必须是严格对称。<br /> <br /> <strong>4.所有的属性必须用引号""括起来</strong><br /> 在HTML中,你可以不需要给属性值加引号,但是在XHTML中,它们必须被加引号。例如:<br /> <span style="color: red"><height=80> </span><br /> 必须修改为:<br /> <span style="color: red"><height="80"> </span><br /> 特殊情况,你需要在属性值里使用双引号,你可以用",单引号可以使用&apos;,例如:<br /> <span style="color: red"><alt="say&apos;hello&apos;"> </span><br /> <br /> <strong>5.把所有<和&特殊符号用编码表示</strong><br /> 任何小于号(<),不是标签的一部分,都必须被编码为& l t ; <br /> 任何大于号(>),不是标签的一部分,都必须被编码为& g t ; <br /> 任何与号(&),不是实体的一部分的,都必须被编码为& a m p; <br /> 注:以上字符之间无空格。<br /> <br /> <strong>6.给所有属性赋一个值</strong><br /> XHTML规定所有属性都必须有一个值,没有值的就重复本身。例如:<br /> <span style="color: red"><td nowrap> <input type="checkbox" name="shirt" value="medium" checked> </span>必须修改为:<br /> <span style="color: red"><td nowrap="nowrap"> <input type="checkbox" name="shirt" value="medium" checked="checked"></span><br />  <br /> <strong>7.不要在注释内容中使“--”</strong><br /> “--”只能发生在XHTML注释的开头和结束,也就是说,在内容中它们不再有效。<br /> 例如下面的代码是无效的:<br /> <span style="color: red"><!--这里是注释-----------这里是注释--> </span><br /> 用等号或者空格替换内部的虚线。<br /> <span style="color: black"><!--这里是注释============这里是注释--> </span><br /> 以上这些规范有的看上去比较奇怪,但这一切都是为了使我们的代码有一个统一、唯一的标准!<br /> 以便于将来的数据再利用!!<br /> <!--em336tj start--></p> </div> <div class="list_page page_group"><ul></ul></div> <div class="infodot"></div> <div class="pre"> 上一篇:<a href="kecheng_990.html" title="江海区附近哪里有学软件开发">江海区附近哪里有学软件开发?</a> </div> <div class="next"> 下一篇:<span class=c9>没有资料</span> </div> </div> </div> </div> </div> </div> <div class="col-md-4"><div class="xbox xbg xside"> <div class="hd"><span><a class="more" href="#">更多+</a></span><a href="#" class="title">热门专业</a> </div> <div class="bd"> <div class="zyesl"> <div class="kcbox"> <div class="imgzye"><img src="assets/images/icons/zyicon01.jpg"></div> <div class="wenzizye"> <div class="wzizye">PHP+MySql实战</div> <div class="wzizyes"><a href="kecheng_1056.html" target="_blank">点击详情</a></div> <div class="wzizyed"><a target="_blank" href="https://api.pop800.com/chat/719274">在线咨询</a></div> <div class="cl"></div> </div> <div class="cl"></div> </div> <div class="kcbox"> <div class="imgzye"><img src="assets/images/icons/zyicon02.jpg"></div> <div class="wenzizye"> <div class="wzizye">数据库编程</div> <div class="wzizyes"><a href="kecheng_994.html" target="_blank">点击详情</a></div> <div class="wzizyed"><a target="_blank" href="https://api.pop800.com/chat/719274">在线咨询</a></div> <div class="cl"></div> </div> <div class="cl"></div> </div> <div class="kcbox"> <div class="imgzye"><img src="assets/images/icons/zyicon03.jpg"></div> <div class="wenzizye"> <div class="wzizye">C#/WinForm软件开发</div> <div class="wzizyes"><a href="kecheng_990.html" target="_blank">点击详情</a></div> <div class="wzizyed"><a target="_blank" href="https://api.pop800.com/chat/719274">在线咨询</a></div> <div class="cl"></div> </div> <div class="cl"></div> </div> <div class="kcbox"> <div class="imgzye"><img src="assets/images/icons/zyicon04.jpg"></div> <div class="wenzizye"> <div class="wzizye">Asp.Net网站开发</div> <div class="wzizyes"><a href="kecheng_989.html" target="_blank">点击详情</a></div> <div class="wzizyed"><a target="_blank" href="https://api.pop800.com/chat/719274">在线咨询</a></div> <div class="cl"></div> </div> <div class="cl"></div> </div> <div class="kcbox"> <div class="imgzye"><img src="assets/images/icons/zyicon05.jpg"></div> <div class="wenzizye"> <div class="wzizye">Web前端开发</div> <div class="wzizyes"><a href="kecheng_988.html" target="_blank">点击详情</a></div> <div class="wzizyed"><a target="_blank" href="https://api.pop800.com/chat/719274">在线咨询</a></div> <div class="cl"></div> </div> <div class="cl"></div> </div> </div> </div> <div class="xbox xbg xside"> <div class="hd"><span><a class="more" href="news_21.html">更多+</a></span><a href="news_21.html" class="title">企业招聘</a> </div> <div class="bd"> <div class="pic-bd"> <a href="news_view_1036.html"><img width="" class="img-responsive" src="upfile/201905/2019051031414955.jpg" alt="明星纸业招软件开发员"><span class="pic-title">明星纸业招软件开发员</span></a> </div> <ul class="arclist arclist-side"> <li><a href="news_view_1045.html" title="华堡钢具招系统维护员">华堡钢具招系统维护员</a><span class="list-t">02-09</span></li> <li><a href="news_view_1044.html" title="超卓科技招C#开发员">超卓科技招C#开发员</a><span class="list-t">02-09</span></li> <li><a href="news_view_1043.html" title="超卓科技招.net程序员">超卓科技招.net程序员</a><span class="list-t">02-09</span></li> <li><a href="news_view_1042.html" title="中港宝田摩托车厂招软件开发员">中港宝田摩托车厂招软件开发员</a><span class="list-t">02-09</span></li> </ul> </div> </div></div> </div> </div> </section> <div class="contact-bar always-fixed" style="display: block;"> <div class="contact-container red-bg"> <a class="contact-weixin normal-btn" data-ic="wap_weixin_bottom" data-value="yihong128"> <i class="icons fa fa-weixin baicon icon-weixin-solid"></i>微信</a> <a class="contact-sms normal-btn" href="sms:13652726615" data-ic="wap_sms_bottom"><i class="icons fa fa-commenting baicon icon-message-solid"> </i>短信</a> <a class="contact-btn normal-btn" href="tel:13652726615" data-ic="wap_contactBottom" onclick="PPreventDefault"><i class="icons fa fa-volume-control-phone baicon icon-contact"> </i>电话</a> </div> </div> <!-- Footer --> <footer id="footer"> <div class="container"> <div class="row"> <div class="col-lg-12 col-md-12 animate-onscroll"> <div class="copyright text-center"> <p>江门黑马电脑培训 咨询电话:<strong style="color:#FF0000">136-5272-6615</strong> 在线QQ交谈:<a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=2011198420&site=qq&menu=yes"> <img border="0" src="assets/images/button_qq1.gif" alt="点击这里给我发消息" title="点击这里给我发消息"></a> 区老师</p> 蓬江培训点:江门电大教学行政楼一楼市民学习服务 <br> 江海培训点:江海区江海花园江殷居7号108室之二<br /> 我们的愿景:做人民满意的电脑培训。 <a href="http://www.miibeian.gov.cn/" rel="nofollow" target="_blank"></a> <div class="weixin_min xs-visibility-none"><img src="assets/images/xjcweixin_min.jpg"></div> </div> </div> </div> </div> </footer> <!-- /Footer --> <!-- Back To Top --> <div class="fixkefu xs-visibility-none"> <div id="top"> </div> </div> <!-- Bootstrap --> <script src="assets/js/owl.carousel.js" type="text/javascript"></script> <script src="assets/js/wow.js" type="text/javascript"></script> <script src="assets/js/swiper.min.js" type="text/javascript"></script> <!-- JavaScript --> <script src="assets/js/script.js" type="text/javascript"></script> <style> body { -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } </style> </body> </html>