HTML6 展望

時間 2021-04-27

標籤 javascript css html java web shell 瀏覽器 app ide 工具欄目 HTML 简体版

原文原文鏈接

HTML5 概述

HTML5 是 HTML 語言最受歡迎的版本之一，它支持音頻和視頻、離線存儲、移動端、和標籤屬性等等。還提供了<article>, <section>, <header>這樣的標籤來幫助開發者更好地組織頁面內容。然而 HTML5 規範仍然沒有最後定稿，而且它並非一個真正意義上的語義標記語言。javascript

HTML6 展望

你有沒有曾經但願能在 HTML 中使用自定義標籤？好比：使用<logo>來顯示你的網站logo，還有使用<toolbar>來顯示工具欄等等。咱們常常使用<div id=」container」>和<div id=」wrapper」>來組織頁面，在 HTML6 裏咱們但願能夠直接使用象<container>和<wrapper>這樣的自定義標籤。css

和 XML 同樣，HTML6 應該支持 namespace（命名空間），如：xmlns:xhtml=」http://www.w3.org/1999/xhtml」html

HTML6 代碼樣例：java

<!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 識別和處理，這樣頁面代碼會更易讀，語義更清晰。web

HTML6 APIs

HTML6 的標籤前帶有命名空間，如：<html:html>, <html:head>等等。shell

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> 標籤同樣。app

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

3.<html:title> 和 <title> 標籤相似。ide

<!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

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。