HTML6 展望

最新推荐文章于 2023-04-28 23:47:17 发布
最新推荐文章于 2023-04-28 23:47:17 发布
阅读量200 收藏
点赞数
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/mihuXiaoLang/article/details/42363879
版权

HTML5 概述

HTML5 是 HTML 语言最受欢迎的版本之一，它支持音频和视频、离线存储、移动端、和标签属性等等。还提供了<article>, <section>, <header>这样的标签来帮助开发者更好地组织页面内容。然而 HTML5 规范仍然没有最后定稿，并且它并不是一个真正意义上的语义标记语言。

HTML6?展望

你有没有曾经希望能在 HTML 中使用自定义标签？比如：使用<logo>来显示你的网站logo，还有使用<toolbar>来显示工具栏等等。我们经常使用<div id=”container”>和<div id=”wrapper”>来组织页面，在 HTML6 里我们希望可以直接使用象<container>和<wrapper>这样的自定义标签。

和 XML 一样，HTML6 应该支持 namespace（命名空间），如：xmlns:xhtml=”http://www.w3.org/1999/xhtml”

HTML6 代码样例：

  <!DOCTYPE html>
  <html:html>
  <html:head>
  <html:title>A Look Into HTML6</html:title>
  <html:meta type="title" value="Page Title">
  <html:meta type="description" value="HTML example with namespaces">
  <html:link src="css/mainfile.css" title="Styles" type="text/css">
  <html:link src="js/mainfile.js" title="Script" type="text/javascript">
  </html:head>
  <html:body>
  <header>
  <logo>
  <html:media type="image" src="images/xyz.png">
  </logo>
  <nav>
  <html:a href="/img1">a1</a>
  <html:a href="/img2">a2</a>
  </nav>
  </header>
  <content>
  <article>
  <h1>Heading of main article</h1>
  <h2>Sub-heading of main article</h2>
  <p>[...]</p>
  <p>[...]</p>
  </article>
  <article>
  <h1>The concept of HTML6</h1>
  <h2>Understanding the basics</h2>
  <p>[...]</p>
  </article>
  </content>
  <footer>
  <copyright>This site is ? to Anonymous 2014</copyright>
  </footer>
  </html:body>
  </html:html>

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

HTML6 APIs

HTML6 的标签前带有命名空间，如：<html:html>, <html:head>等等。

1.<html:html>

  <!DOCTYPE html>
  <html:html>// this is equivalent to <html> tag written in previous HTML versions
  <!-- sample of HTML document -->
  </html:html>

2.<html:head> 和 <head> 标签一样。

  <!DOCTYPE html>
  <html:html>
  <html:head>
  <!-- Main content would come here, like the <html:title> tag -->
  </html:head>
  </html:html>

3.<html:title> 和 <title> 标签类似。

  <!DOCTYPE html>
  <html:html>
  <html:head>
  <html:title>A Look Into HTML6</html:title>
  </html:head>
  </html:html>

4.<html:meta> 和 <meta> 标签类似，不同之处在于，在 HTML5 中你只能使用标准的元数据类型，如：”keywords”, “description”, “author”等，而在 HTML6 中你可以使用任何元数据类型。

  <!DOCTYPE html>
  <html:html>
  <html:head>
  <html:title>A Look Into HTML6</html:title>
  <html:meta type="description" value="HTML example with namespaces">
  </html:head>
  </html:html>

5.<html:link> 和 HTML6 之前版本的 <link> 标签类似。

  <!DOCTYPE html>
  <html:html>
  <html:head>
  <html:title>A Look Into HTML6</html:title>
  <html:link src="js/mainfile.js" title="Script" type="text/javascript">
  </html:head>
  </html:html>

6.<html:body> 和 <body> 标签一样。

  <!DOCTYPE html>
  <html:html>
  <html:head>
  <html:title>A Look Into HTML6</html:title>
  </html:head>
  <html:body>
  <!-- This is where your website content is placed -->
  </html:body>
  </html:html>

7.<html:a> 和 <a> 标签类似，区别是 <html:a> 只有 “href” 一个属性。

  <!DOCTYPE html>
  <html:html>
  <html:head>
  <html:title>A Look Into HTML6</html:title>
  </html:head>
  <html:body>
  <html:a href="http://siteurl">Go to siteurl.com!</html:a>
  </html:body>
  </html:html>

8.<html：button> 和 <button> 及 <input type=”button”> 一样。

  <!DOCTYPE html>
  <html:html>
  <html:head>
  <html:title>A Look Into HTML6</html:title>
  </html:head>
  <html:body>
  <html:button>Click Here</html:button>
  </html:body>
  </html:html>

9.<html:media> 涵盖 <img>, <video>, <embed> 等标签的所有功能。<html:media> 的好处是你不用根据不同的媒体文件类型使用不同的标签，媒体的类型由浏览器从文件内容（类型属性，扩展名，和MIME type）中来判断。

  <!DOCTYPE html>
  <html:html>
  <html:head>
  <html:title>A Look Into HTML6</html:title>
  </html:head>
  <html:body>
  <!-- Image would come here -->
  <html:media src="img1/logo.jpg" type="image">
  <!-- Video doesn't need a type -->
  <html:media src="videos/slide.mov">
  </html:body>
  </html:html>

标签类型(Tag types)概述

和 HTML5 一样， HTML6 也有两种标签类型：单标签（single tag) 和双标签（double tag）

  <html:meta type="author" content="single tag">
  <html:meta type="author" content="double tag" />

单标签不需要结束符’/’

结语

HTML6 规范还未发布，本文原作者 Oscar Godson?只是为我们提供了一个对 HTML6 规范的展望，或者说他希望 HTML6 能够支持的一些新特性。

英文原文
via coolshell.cn

mihuXiaoLang
关注
漂亮的作品展示html5网站模板
03-13
漂亮的作品展示html5网站模板！只要你懂少少html常识，就可以设计漂亮的网站界面
HTML5未来展望
weixin_34380296的博客
07-31 273
HTML5未来展望 1）WebGL OpenGL是1992年创建的跨平台3D绘图标准，它已被广泛应用于游戏和计算机辅助设计中，并成为微软direct3D的有力竞争对手。 与其他HTML5元素一样，WebGL将会成为Web平台不可或缺的一部分。 2）设备 Web应用很可能需要访问多媒体硬件，入网络摄像头，麦克风或是已连接的存储设备。为此，HTML5设计了device元素，以...
HTML5展望
weixin_30682415的博客
05-27 161
1.简述API 2.Cavans e.g.画一个三角形 <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Canvas</title> <style type="text/css"> ...
HTML的发展趋势
m0_65051363的博客
07-09 1605
HTML的发展趋势
HTML5到底会有什么发展?HTML5的前景展望
12-14
HTML5作为一种具有革命性的网络技术，正在逐渐改变Web应用程序的开发模式。它的出现，被誉为Flash的替代者，尤其是在移动互联网领域，HTML5展现了强大的潜力。HTML5的核心在于它引入了一系列新元素和属性，增强了...
html+css网页设计 宝石的领域应用先状、前沿及发展展望10个页面
最新发布
09-06
预览地址:https://blog.csdn.net/qq_42431718/article/details/141957088 html+css网页设计 宝石的领域应用先状、前沿及发展展望10个页面
html+css网页制作 自定义网站 钻石戒指：专业领域应用现状、前沿及发展展望、10个页面
08-26
预览地址:https://blog.csdn.net/qq_42431718/article/details/141563813 html+css网页制作 自定义网站 钻石戒指：专业领域应用现状、前沿及发展展望、10个页面
html5展望,HTML5展望(示例代码)
weixin_39534780的博客
06-24 118
1.简述API2.Cavanse.g.画一个三角形Canvas* {margin: 0;padding: 0;border: none;}canvas {position: absolute;top: 0;right: 0;bottom: 0;left: 0;display: block;margin: auto;background: #ececec;}window.onload = funct...
HTML5前景展望
weixin_30732825的博客
10-02 125
HTML5，被传为Flash 的杀手，是一种用于web 应用程序开发、具有变革意义的网络技术。HTML 5提供了一些新的元素和属性，其中有些是技术上类似<div>和<span>标签，但有一定含义，例如<nav>和<footer>。这种标签将有利于搜索引擎的索引整理、小屏幕设备和视障人士使用。同时为其他浏览要素提供了新的功能，通过一个标准接...
html校园网页设计作品欣赏,html网页设计作品
weixin_35907189的博客
05-30 1619
在电子商务不断发展的过程中,网页的设计也得到迅速的发展,因此,对网页设计的要求也不断提高,尤其是在创新的社会背景下,网页设计的新理念和新方法,不断推陈出新。下面学习啦小编为大家整理了html网页设计作品，希望大家喜欢。html网页设计作品鉴赏html网页设计作品图1html网页设计作品图2html网页设计作品图3html网页设计作品图4html网页设计作品图5HTML的特点优势HTML文档制作不是...
html简单网页设计作品_创新网页设计 放飞想象翅膀传播学期中优秀作品展示
weixin_39750195的博客
11-29 675
信息时代，网站成为企业、个人传播信息的重要方式，网页作为网站有机整体的重要组成部分，不仅有着精准传达信息的功能，同时也具有相应的审美功能。优秀的网页设计会更好地展现企业及个人风采，能够提升受众群体对信息本身的关注度，起到更好地识别、记忆的作用。《网页设计与制作》带领同学们了解、学习了网页设计与制作的相关知识，通过不断的动手实践，由浅入深，掌握网页设计、制作的方法和规则。■ AUTUMN...
html优秀作品展示,31个漂亮的作品展示网页设计
weixin_42151729的博客
05-30 2305
31个漂亮的作品展示网页设计5月 30, 2012评论Sponsor无论你是网页设计师、开发人员、艺术家或是摄影师，当你需要展示你的作品的时候，你就需要一个作品集，而这个作品集也是需要设计的，需要有良好的用户体验和能够体现出你的创意设计，客户不仅仅是看你工作做了什么，他们浏览你的网站也可以看出你的专业水平去到哪里，这是也是很重要的。下面就是今天为大家分享的一些展示作品集的网页设计，每个都很友好，E...
【web基础】html常用标签+作品展示
qq_48584557的博客
04-28 4254
小亭子正在努力的学习编程，接下来将开启javaEE的学习~~分享的文章都是学习的笔记和感悟，如有不妥之处希望大佬们批评指正~~说明：此部分是java web基础知识，学的不深，仅为了后期独立实现项目时能够自己写前端页面。目录前言标签也有层次关系HTML 常见标签注释标签标题标签段落标签换行标签格式化标签图片标签：img代码示例超链接标签 a表格标签合并单元格列表标签表单标签input 标签1.文本框2.密码框3.单选框4.复选框5.普通按钮6.提交按钮7.清空按钮8.选择文件lable标签。
HTML获奖作品,最新潮的24组获奖网页作品欣赏
weixin_33050117的博客
05-30 1875
当下的设计趋势已经彻底改变了过去几年对于网页设计的概念，而且至少在接下来的这一年里会发展得如火如荼。我们已经接触到了垂直滚动、扁平化设计、复古的配色、极简的配色，以及幻灯动画展示，当然，响应式设计才是最头等的趋势。最近我们看到了透明的幻灯展示以及长投影设计，在本文的案例中，我们将会看到这些趋势带来了巨大的影响，它们颠覆了以往的拟物设计成为新一轮的潮流。随着移动设备的扩大使用，设计师的责任愈加重大，...
html - 超文本标记语言
anyao4367的博客
01-06 195
超文本标记语言，标准通用标记语言下的一个应用。 “超文本”就是指页面内可以包含图片、链接，甚至音乐、程序等非文字元素。 超文本标记语言的结构包括“头”部分（外语：Head）、和“主体”部分（外语：Body），其中“头”部提供关于网页的信息，“主体”部分提供网页的具体内容。 发展历史 超文本标记语言（第一版）——在1993年6月作为互联网工程工作小组（IETF）工作草案发...
html6发布时间,HTML6初探，你没看错，是6不是5
weixin_39526546的博客
06-05 1383
原标题：HTML6初探，你没看错，是6不是5HTML5还没玩出个所以然，刚刚在网上看到关于HTML6的信息。程序员这工作。我只想说。。。头儿！我要转行！！！ HTML5 概述HTML5 是 HTML 语言最受欢迎的版本之一，它支持音频和视频、离线存储、移动端、和标签属性等等。还提供了, , 这样的标签来帮助开发者更好地组织页面内容。然而 HTML5 规范仍然没有最后定稿，并且它并不是一个真正意义上...
html6预计发布时间,HTML6 展望
weixin_42628464的博客
06-10 2997
HTML5 概述HTML5 是 HTML 语言最受欢迎的版本之一，它支持音频和视频、离线存储、移动端、和标签属性等等。还提供了, , 这样的标签来帮助开发者更好地组织页面内容。然而 HTML5 规范仍然没有最后定稿，并且它并不是一个真正意义上的语义标记语言。HTML6展望你有没有曾经希望能在 HTML 中使用自定义标签？比如：使用来显示你的网站logo，还有使用来显示工具栏等等。我们经常使用和来...
HTML压缩技术的现状与展望
6. HTML与CSS和JavaScript的关联：通常，单独的HTML无法创建一个完整且美观的网站，它需要与CSS（层叠样式表）和JavaScript协同工作。CSS用于设计网页的样式，而JavaScript则负责网页的行为和动态效果。 7. Web开发...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值