HTML6 初探 — 你没看错,是6不是5

HTML5 概述

专注于为中小企业提供网站设计、网站建设服务,电脑端+手机端+微信端的三站合一,更高效的管理,为中小企业泽库免费做网站提供优质的服务。我们立足成都,凝聚了一批互联网行业人才,有力地推动了上千家企业的稳健成长,帮助中小企业通过网站建设实现规模扩充和转变。

HTML5 是 HTML 语言***的版本之一,它支持音频和视频、离线存储、移动端、和标签属性等等。还提供了

这样的标签来帮助开发者更好地组织页面内容。然而 HTML5 规范仍然没有***定稿,并且它并不是一个真正意义上的语义标记语言。

HTML6 展望

你有没有曾经希望能在 HTML 中使用自定义标签?比如:使用来显示你的网站logo,还有使用来显示工具栏等等。我们经常使用来组织页面,在 HTML6 里我们希望可以直接使用象这样的自定义标签。

和 XML 一样,HTML6 应该支持 namespace(命名空间),如:xmlns:xhtml=”http://www.w3.org/1999/xhtml”

HTML6 代码样例:

 
 
  1.  
  2.  
  3.   
  4.  
  5.   
  6.  
  7.  A Look Into HTML6 
  8.  
  9.   
  10.  
  11.   
  12.  
  13.   
  14.  
  15.   
  16.  
  17.   
  18.  
  19.   
  20.  
  21.  
     
  22.  
  23.   
  24.  
  25.   
  26.  
  27.   
  28.  
  29.  
  30.  
  31.  a1 
  32.  
  33.  a2 
  34.  
  35.   
  36.  
  37.  
 
  •  
  •   
  •  
  •  
     
  •  
  •  

    Heading of main article

     
  •  
  •  

    Sub-heading of main article

     
  •  
  •  

    [...]

     
  •  
  •  

    [...]

     
  •  
  •  
  •  
  •  
  •  
     
  •  
  •  

    The concept of HTML6

     
  •  
  •  

    Understanding the basics

     
  •  
  •  

    [...]

     
  •  
  •   
  •  
  •   
  •  
  •  
     
  •  
  •  This site is © to Anonymous 2014 
  •  
  •   
  •  
  •   
  •  
  •   
  • 在上面的代码中,你也许注意到了一些奇怪的标签,它们是 W3C 和 HTML6 规范中在命名空间里定义的标签。例如:负责设定你浏览器的标题栏文字,负责显示图片等等。用户可以自己定义标签以便 JavaScript 和 CSS 识别和处理,这样页面代码会更易读,语义更清晰。

    HTML6 APIs

    HTML6 的标签前带有命名空间,如:等等。

    1. 

     
     
    1.  
    2.  
    3.  // this is equivalent to  tag written in previous HTML versions 
    4.  
    5.   
    6.  
    7.   

    2.  和  标签一样。

     
     
    1.  
    2.  
    3.   
    4.  
    5.   
    6.  
    7.   
    8.  
    9.   
    10.  
    11.   

    3.  和  标签类似。</p><pre> <ol> <li><!DOCTYPE html> </li> <li> </li> <li> <html:html> </li> <li> </li> <li> <html:head> </li> <li> </li> <li> <html:title>A Look Into HTML6</html:title> </li> <li> </li> <li> </html:head> </li> <li> </li> <li> </html:html> </li> </ol></pre><p>4. <html:meta> 和 <meta> 标签类似,不同之处在于,在 HTML5 中你只能使用标准的元数据类型,如:”keywords”, “description”, “author”等,而在 HTML6 中你可以使用任何元数据类型。</p><pre> <ol> <li><!DOCTYPE html> </li> <li> </li> <li> <html:html> </li> <li> </li> <li> <html:head> </li> <li> </li> <li> <html:title>A Look Into HTML6</html:title> </li> <li> </li> <li> <html:meta type="description" value="HTML example with namespaces"> </li> <li> </li> <li> </html:head> </li> <li> </li> <li> </html:html> </li> </ol></pre><p>5. <html:link> 和 HTML6 之前版本的 <link> 标签类似。</p><pre> <ol> <li><!DOCTYPE html> </li> <li> </li> <li> <html:html> </li> <li> </li> <li> <html:head> </li> <li> </li> <li> <html:title>A Look Into HTML6</html:title> </li> <li> </li> <li> <html:link src="js/mainfile.js" title="Script" type="text/javascript"> </li> <li> </li> <li> </html:head> </li> <li> </li> <li> </html:html> </li> </ol></pre><p>6. <html:body> 和 <body> 标签一样。</p><pre> <ol> <li><!DOCTYPE html> </li> <li> </li> <li> <html:html> </li> <li> </li> <li> <html:head> </li> <li> </li> <li> <html:title>A Look Into HTML6</html:title> </li> <li> </li> <li> </html:head> </li> <li> </li> <li> <html:body> </li> <li> </li> <li> <!-- This is where your website content is placed --> </li> <li> </li> <li> </html:body> </li> <li> </li> <li> </html:html> </li> </ol></pre><p>7. <html:a> 和 <a> 标签类似,区别是 <html:a> 只有 “href” 一个属性。</p><pre> <ol> <li><!DOCTYPE html> </li> <li> </li> <li> <html:html> </li> <li> </li> <li> <html:head> </li> <li> </li> <li> <html:title>A Look Into HTML6</html:title> </li> <li> </li> <li> </html:head> </li> <li> </li> <li> <html:body> </li> <li> </li> <li> <html:a href="http://siteurl">Go to siteurl.com!</html:a> </li> <li> </li> <li> </html:body> </li> <li> </li> <li> </html:html> </li> </ol></pre><p>8. <html:button> 和 <button> 及 <input type=”button”> 一样。</p><pre> <ol> <li><!DOCTYPE html> </li> <li> </li> <li> <html:html> </li> <li> </li> <li> <html:head> </li> <li> </li> <li> <html:title>A Look Into HTML6</html:title> </li> <li> </li> <li> </html:head> </li> <li> </li> <li> <html:body> </li> <li> </li> <li> <html:button>Click Here</html:button> </li> <li> </li> <li> </html:body> </li> <li> </li> <li> </html:html> </li> </ol></pre><p>9. <html:media> 涵盖 <img>, <video>, <embed> 等标签的所有功能。<html:media> 的好处是你不用根据不同的媒体文件类型使用不同的标签,媒体的类型由浏览器从文件内容(类型属性,扩展名,和MIME type)中来判断。</p><pre> <ol> <li><!DOCTYPE html> </li> <li> </li> <li> <html:html> </li> <li> </li> <li> <html:head> </li> <li> </li> <li> <html:title>A Look Into HTML6</html:title> </li> <li> </li> <li> </html:head> </li> <li> </li> <li> <html:body> </li> <li> </li> <li> <!-- Image would come here --> </li> <li> </li> <li> <html:media src="img1/logo.jpg" type="image"> </li> <li> </li> <li> <!-- Video doesn't need a type --> </li> <li> </li> <li> <html:media src="videos/slide.mov"> </li> <li> </li> <li> </html:body> </li> <li> </li> <li> </html:html> </li> </ol></pre><p><strong>标签类型(Tag types)概述</strong></p><p>和 HTML5 一样, HTML6 也有两种标签类型:单标签(single tag) 和双标签(double tag)</p><pre> <ol> <li><html:meta type="author" content="single tag"> </li> <li> </li> <li> <html:meta type="author" content="double tag" /> </li> </ol></pre><p>单标签不需要结束符’/’</p><p><strong>结语</strong></p><p>HTML6 规范还未发布,本文原作者Oscar Godson 只是为我们提供了一个对 HTML6 规范的展望,或者说他希望 HTML6 能够支持的一些新特性。</p> <p> 当前标题:<a href="http://www.mswzjz.cn/qtweb/news43/157893.html">HTML6 初探 — 你没看错,是6不是5</a> <br> 浏览地址:<a href="http://www.mswzjz.cn/qtweb/news43/157893.html">http://www.mswzjz.cn/qtweb/news43/157893.html</a> </p> <p> 攀枝花网站建设、攀枝花网站运维推广公司-贝锐智能,是专注品牌与效果的网络营销公司;服务项目有等 </p> <p class="adpic"> <a href="https://www.cdcxhl.com/service/ad.html" target="_blank" class="ad">广告</a> <a href="" target="_blank" class="adimg"><img src=""></a> </p> <p class="copy"> 声明:本网站发布的内容(图片、视频和文字)以用户投稿、用户转载内容为主,如果涉及侵权请尽快告知,我们将会在第一时间删除。文章观点不代表本网站立场,如需处理请联系客服。电话:028-86922220;邮箱:631063699@qq.com。内容未经允许不得转载,或转载时需注明来源: <a href="http://www.mswzjz.cn/" target="_blank">贝锐智能</a> </p> </div> <div class="newsmorelb"> <p>贝锐智能技术为您推荐以下文章</p> <ul> <li> <a href="/qtweb/news42/157892.html">游戏开发者应关注游戏中的道德评判标准</a> </li><li> <a href="/qtweb/news41/157891.html">面试突击:为什么ConcurrentHashMap是线程安全的?</a> </li><li> <a href="/qtweb/news40/157890.html">创新互联less教程:Less导入指令</a> </li><li> <a href="/qtweb/news39/157889.html">还在用幕布备案?小程序扫一扫,轻松完成电子化核验!(幕布备案照片怎么拍)</a> </li><li> <a href="/qtweb/news38/157888.html">云服务器ping不通本地ip</a> </li><li> <a href="/qtweb/news37/157887.html">WordPress主题开发入门基础教程</a> </li><li> <a href="/qtweb/news36/157886.html">Spring框架人气暴涨</a> </li><li> <a href="/qtweb/news35/157885.html">巧影制作视频教程,巧影画中画制作视频教程_巧影入门制作视频教程</a> </li><li> <a href="/qtweb/news34/157884.html">麻烦问下mPaaS中不支持12以前系统,包含12吗?</a> </li> </ul> </div> </div> <div class="col-lg-3 noneb"> <div class="bkright" style="margin-top: 0"> <p><a href="https://www.cdcxhl.com/news//">解决方案知识</a></p> <ul> <li> <a class="text_overflow" href="/qtweb/news7/238807.html">企业将业务迁移到云端时准备应对的挑战</a> </li><li> <a class="text_overflow" href="/qtweb/news42/38542.html">JavaRMI远程调用</a> </li><li> <a class="text_overflow" href="/qtweb/news8/93008.html">电脑关机时怎么设置把显示器一起关掉?cwindows子系统下关闭显示器</a> </li><li> <a class="text_overflow" href="/qtweb/news13/297863.html">服务器使用大内存有什么好处?服务器大内存</a> </li><li> <a class="text_overflow" href="/qtweb/news35/272735.html">Oracle合并函数的两种类型介绍</a> </li><li> <a class="text_overflow" href="/qtweb/news13/253463.html">相位怎么看?(星盘相位怎么看)</a> </li><li> <a class="text_overflow" href="/qtweb/news19/406869.html">网络是好的为什么无法连接服务器?(服务器可以上网吗)</a> </li><li> <a class="text_overflow" href="/qtweb/news25/385625.html">探究数据库的关系演算思想(数据库关系演算)</a> </li><li> <a class="text_overflow" href="/qtweb/news27/314677.html">简单易懂!使用Linux复制并压缩您的文件夹(linux复制压缩包)</a> </li><li> <a class="text_overflow" href="/qtweb/news45/70095.html">云主机磁盘类型有哪些</a> </li><li> <a class="text_overflow" href="/qtweb/news4/133604.html">win7怎样设繁体中文?windows7繁体中文语言包</a> </li><li> <a class="text_overflow" href="/qtweb/news3/143003.html">怎样选择优秀的云服务器供应商?(公司该怎么挑选云服务供应商呢)</a> </li><li> <a class="text_overflow" href="/qtweb/news25/292175.html">阿里云域名续费是多少?(域名续费价格怎么查询)</a> </li><li> <a class="text_overflow" href="/qtweb/news14/340764.html">深入理解Redis的过期策略(redis的过期策略包括)</a> </li><li> <a class="text_overflow" href="/qtweb/news14/548464.html">事务是什么</a> </li> </ul> </div> <div class="bkright tag"> <p><a href="https://www.cdcxhl.com/hangye/link.html" target="_blank">各行业网站</a></p> <ul> <li class="col-lg-6 col-md-6 col-sm-6 col-xs-6"> <a href="https://www.cdcxhl.com/hangye/renzaowu/" target="_blank">人造雾</a> </li><li class="col-lg-6 col-md-6 col-sm-6 col-xs-6"> <a href="https://www.cdcxhl.com/hangye/zhanting/" target="_blank">展览展示</a> </li><li class="col-lg-6 col-md-6 col-sm-6 col-xs-6"> <a href="https://www.cdcxhl.com/hangye/hntjbj/" target="_blank">混凝土搅拌机</a> </li><li class="col-lg-6 col-md-6 col-sm-6 col-xs-6"> <a href="https://www.cdcxhl.com/hangye/xiaojbc/" target="_blank">小搅拌车</a> </li><li class="col-lg-6 col-md-6 col-sm-6 col-xs-6"> <a href="https://www.cdcxhl.com/hangye/gangting/" target="_blank">岗亭</a> </li><li class="col-lg-6 col-md-6 col-sm-6 col-xs-6"> <a href="https://www.cdcxhl.com/hangye/fwqzy/" target="_blank">服务器租用</a> </li><li class="col-lg-6 col-md-6 col-sm-6 col-xs-6"> <a href="https://www.cdcxhl.com/hangye/bangongkongjian/" target="_blank">办公空间设计</a> </li><li class="col-lg-6 col-md-6 col-sm-6 col-xs-6"> <a href="https://www.cdcxhl.com/hangye/swzbw/" target="_blank">三维植被网</a> </li><li class="col-lg-6 col-md-6 col-sm-6 col-xs-6"> <a href="https://www.cdcxhl.com/hangye/ggsj/" target="_blank">广告设计</a> </li><li class="col-lg-6 col-md-6 col-sm-6 col-xs-6"> <a href="https://www.cdcxhl.com/hangye/bgcl/" target="_blank">办公窗帘</a> </li><li class="col-lg-6 col-md-6 col-sm-6 col-xs-6"> <a href="https://www.cdcxhl.com/hangye/gsdb/" target="_blank">工商代办</a> </li><li class="col-lg-6 col-md-6 col-sm-6 col-xs-6"> <a href="https://www.cdcxhl.com/hangye/banjia/" target="_blank">搬家公司</a> </li><li class="col-lg-6 col-md-6 col-sm-6 col-xs-6"> <a href="https://www.cdcxhl.com/hangye/suliaodai/" target="_blank">塑料袋</a> </li><li class="col-lg-6 col-md-6 col-sm-6 col-xs-6"> <a href="https://www.cdcxhl.com/hangye/blgds/" target="_blank">玻璃钢雕塑</a> </li><li class="col-lg-6 col-md-6 col-sm-6 col-xs-6"> <a href="https://www.cdcxhl.com/hangye/hntjbg/" target="_blank">混凝土搅拌罐</a> </li><li class="col-lg-6 col-md-6 col-sm-6 col-xs-6"> <a href="https://www.cdcxhl.com/hangye/zsljbc/" target="_blank">自上料搅拌车</a> </li> </ul> </div> </div> </div> <div class="carousel-inner linkbg" style="background: #fff"> <div class="container"> <a href="https://www.cdxwcx.com/jifang/deyang.html" target="_blank">德阳机房</a>    <a href="http://chengdu.cdcxhl.com/weixin/" target="_blank">微信公众号二次开发</a>    <a href="http://www.zhuanlizhuanrang.cn/" target="_blank">四川审计公司</a>    <a href="http://www.nengjingkeji.cn/" target="_blank">成都能净科技</a>    <a href="http://www.tpbzx.cn/" target="_blank">www.tpbzx.cn</a>    <a href="http://chengdu.cdcxhl.cn/dingzhi/ " target="_blank">高端定制网站设计</a>    <a href="https://www.cdcxhl.cn/ " target="_blank">腾讯云免备案空间</a>    <a href="http://www.bzwzjz.com/" target="_blank">广东网站设计</a>    <a href="http://www.hzxinyuan.com/" target="_blank">佑馨产后护理</a>    <a href="http://www.ncwzjz.com/" target="_blank">南充网站建设</a>    <a href="http://www.cdweb.net/" target="_blank">成都网站设计</a>    <a href="http://www.cdkjz.cn/fangan/led/" target="_blank">LED网站设计方案</a>    <a href="http://m.cdcxhl.com/muban.html" target="_blank">成都模版网站建设</a>    <a href="https://www.xwcx.net/" target="_blank">成都服务器托管</a>    <a href="https://www.cdcxhl.com/shoulu/" target="_blank">网站免费收录</a>    <a href="http://www.muyideyu.com/" target="_blank">营山母婴护理中心</a>    <a href="http://www.kswcd.com/mobile/" target="_blank">手机网站建设</a>    <a href="http://www.cxjianzhan.com/" target="_blank">网站推广</a>    <a href="https://www.cdxwcx.com/jifang/yaan.html" target="_blank">雅安电信机房</a>    <a href="http://www.cdkjz.cn/fangan/response/" target="_blank">响应式网站设计方案</a>     </div> </div> <footer> <div class="carousel-inner footjz"> <div class="container"> <i class="icon iconfont zbw"></i> 品质网站制作 <i class="icon iconfont"></i> 自适应网站 <i class="icon iconfont"></i> 开发成本低 <i class="icon iconfont"></i> 响应速度快 <i class="icon iconfont"></i> 多人服务好 <button type="button" class="btn btn-default btn-lg" onClick="window.location.href='tencent://message/?uin=631063699&Site=&Menu=yes'"> 立即开始600网站建设</button> <button type="button" class="btn btn-default btn-xs" onClick="window.location.href='tencent://message/?uin=631063699&Site=&Menu=yes'"> 600网站制作</button> </div> </div> <div class="carousel-inner bqsy"> <div class="container"> <div class="lxfs"> <h4 class="yutelnone">028-86922220 13518219792</h4> <h4 class="yutelblock"><a href="tel:02886922220">028-86922220</a> <a href="tel:13518219792">13518219792</a></h4> <a class="btn btn-default" href="tencent://message/?uin=532337155&Site=&Menu=yes" role="button">网站建设<span>QQ</span>:532337155</a> <a class="btn btn-default" href="tencent://message/?uin=631063699&Site=&Menu=yes" role="button">营销推广<span>QQ</span>:631063699</a> <a class="btn btn1 btn-default" href="mqqwpa://im/chat?chat_type=wpa&uin=532337155&version=1&src_type=web&web_src=oicqzone.com" role="button">网站制作<span>QQ</span>:532337155</a> <a class="btn btn1 btn-default" href="mqqwpa://im/chat?chat_type=wpa&uin=631063699&version=1&src_type=web&web_src=oicqzone.com" role="button">营销推广<span>QQ</span>:631063699</a> <a class="btn btn-default nonea" href="tencent://message/?uin=1683211881&Site=&Menu=yes" role="button">售后QQ:1683211881</a> <div class="dz">创新互联建站专注: <a href="http://www.mswzjz.cn/" target="_blank">攀枝花网站设计</a> <a href="http://www.mswzjz.cn/" target="_blank">攀枝花网站制作</a> <a href="http://www.mswzjz.cn/" target="_blank">攀枝花网站建设</a> <address>地址:成都太升南路288号锦天国际A幢10楼</address> </div> </div> <div class="bzdh dz"><img src="https://www.cdcxhl.com/imges/bottom_logo.png" alt="创新互联"> <p><a href="https://www.cdcxhl.com/menu.html" target="_blank">成都创新互联科技有限公司</a><br> Tel:028-86922220(7x24h)</p></div> </div> </div> </footer> </body> </html> <script> $.getJSON ("../../qtwebpic.txt", function (data) { var jsonContent = { "featured":data } var random = jsonContent.featured[Math.floor(Math.random() * jsonContent.featured.length)]; $(".adpic .adimg").attr("href",random.link) $(".adpic img").attr("src",random.pic); }) </script>