學(xué)html5需要什么基礎(chǔ)？

年來，html5前端開發(fā)受到很多企業(yè)的青睞；html5火爆的市場現(xiàn)象使此類人才供不應(yīng)求，市場需求導(dǎo)致學(xué)習(xí)html5開發(fā)的人越來越多。那么學(xué)習(xí)HTML5需要什么基礎(chǔ)？下面本篇文章就來給大家介紹一下。

學(xué)習(xí)HTML5之前，我們必須要掌握一些基礎(chǔ)，需要先學(xué)會HTML，CSS ,Javascript ，jQuery；有一定的英文基礎(chǔ)。

其中HTML5主要是要HTML控件+Javascript的腳本程序；搞不好你看到的h5效果就是一個JavaScript的Canvas效果。

建議先去學(xué)好Html、CSS和JavaScript（通常是一起的），然后再學(xué)習(xí)HTML5的相關(guān)知識。這類書籍和視頻還是很多的，而且大都大同小異。

以上就是學(xué)html5需要什么基礎(chǔ)？的詳細內(nèi)容，更多請關(guān)注其它相關(guān)文章！

更多技巧請《轉(zhuǎn)發(fā) + 關(guān)注》哦！

html5介紹

在編寫html文檔時,<!doctype>聲明必須位于html5文檔中的第一行:

<!doctype html>

字符編碼(字符集)聲明也被簡化:

html5中的默認字符編碼是UTF-8

對于中文網(wǎng)頁需要使用<meta charset="UTF-8">聲明編碼,否則會出現(xiàn)亂碼.

html5中的一些新特性:

●用于繪畫的canvas元素

●用于媒介回放的video和audio元素

●對本地離線存儲的更好的支持

●新的特殊的內(nèi)容元素.比如article,footer, header,nav,section

●新的表單控件.比如calendar,date,time,email,url,search

二 html 內(nèi)容模型

html5中引入了很多的標記元素,根據(jù)內(nèi)容類型的不同,這些元素被分成7大類:

●內(nèi)聯(lián)(Embedded)

●流(Flow>)

●標題(Heading)

●交互(Interactive)

●元數(shù)據(jù)(Metadata)

●短語(Phrasing)

●區(qū)段(Sectioning)

html內(nèi)容類型旨在使標記結(jié)構(gòu)對瀏覽器和網(wǎng)站設(shè)計者更有意義

元數(shù)據(jù)(Metadata):通常出現(xiàn)在頁面的head中,設(shè)置頁面其他部分的表現(xiàn)和行為.

元素:<base>,<link>,<meta>,<noscript>,<script>,<style>,<title>

內(nèi)聯(lián)(Embedded):在文檔中添加其他類型的內(nèi)容.

元素:<audio>,<video>,<canvas>,<iframe>,<img>,<math>,<object>,<svg>

交互(Interactive):與用戶交互的內(nèi)容.

元素:<a>,<audio>,<video>,<button>,<details>,<embed>,<iframe>,<img>,<input>,<label>,<object>,<select>,<textarea>

標題(Heading):定義段落標題

元素:<h1>,<h2,<h3>,<h4>,<h5>,<h6>,<hgroup>

短語(Phrasing):文本和文本標記元素

元素:<img>,<span>,<strong>,<label>,<br/>,<small>,<sub>等

相同的元素可以屬于多個內(nèi)容模型

流(Flow)內(nèi)容:包含在文檔正常流中的大多數(shù)html5元素

區(qū)段(Sectioning)內(nèi)容:定義標題,內(nèi)容,導(dǎo)航和頁腳的范圍

元素:<article>,<aside>,<nav>,<section>

流(Flow)包含了幾乎所有的其他內(nèi)容.

三 html頁面結(jié)構(gòu)

通用的html5頁面結(jié)構(gòu)如下圖所示:

在編寫html5文檔時,你可能不需要其中的某些元素,具體取決于你的頁面結(jié)構(gòu)

四 header, nav&footer

在html4中,我們將定義一個這樣的頭:

在html5中,我們使用簡單的<header>標簽

<header>標簽定義了文檔的頭部區(qū)域

<header>元素適合在<body>標簽內(nèi)部使用

實例:

<!doctype html>

<html>

<body>

</header>

</body>

</html>

注意:<header>與<head>標簽不同

在html5中,<footer>標簽定義文檔或者文檔的一部分區(qū)域的頁腳

文檔的頁腳:

<p>Posted by:A ping</p>

</footer>

在典型情況下,<footer>元素會包含文檔創(chuàng)作者的姓名,文檔的版權(quán)信息,使用條款的鏈接,聯(lián)系信息等等

在html5中,<nav>標簽定義導(dǎo)航鏈接的部分

并不是所有的html文檔都要使用到<nav>元素.<nav>元素只是作為標注一個導(dǎo)航鏈接的區(qū)域

一個導(dǎo)航鏈接的實例:

<nav>

<a href="/jquery">JQuery</a>

</nav>

運行效果如下:

一個通用的html5頁面結(jié)構(gòu):

<body>

<nav>

五 article,section&aside

在html5中,<article>標簽定義獨立的內(nèi)容

<article>標簽定義的內(nèi)容本身必須是有意義的且必須是獨立于文檔的其余部分

<article>的潛在來源:

●論壇帖子

●博客文章

●新聞故事

●評論

實例：

<p>文章元素的內(nèi)容</p>

</article>

在html5中,<section>標簽定義了文檔的某個區(qū)域.比如章節(jié),頭部,底部或者文檔的其他區(qū)域

實例:

文檔的某個區(qū)域,解釋了什么是W3C:

<p>World Wide Web Consortium(W3C)是萬維網(wǎng)聯(lián)盟...</p>

</section>

在html5中,<aside>標簽定義<article>標簽外的內(nèi)容

aside的內(nèi)容應(yīng)該與附近的內(nèi)容相關(guān)

實例:

<aside>

<h4>Epcot Center</h4>

<p>The Epcot Center is a theme park in Disney World,Florida</p>

</aside>

提示:<aside>的內(nèi)容可用作文章的側(cè)欄

歡的可以收藏轉(zhuǎn)發(fā)加關(guān)注

HTML5經(jīng)歷了前期HTML快速的更新?lián)Q代，以其獨有特性的優(yōu)勢迅速占據(jù)了網(wǎng)頁開發(fā)市場鰲頭。介于目前學(xué)習(xí)和想要從事HTML5網(wǎng)頁開發(fā)的人越來越多。本次，給大家整理了一下基本的HTML5學(xué)習(xí)路線圖，適應(yīng)于一些零基礎(chǔ)學(xué)習(xí)HTML5的同學(xué)借鑒。

如果你依然在編程的世界里迷茫，不知道自己的未來規(guī)劃，可以加入web前端學(xué)習(xí)交流秋秋圈：767273102 里面可以與大神一起交流并走出迷茫。新手可免費領(lǐng)取學(xué)習(xí)資料，看看前輩們是如何在編程的世界里傲然前行不停更新最新的教程和學(xué)習(xí)方法（詳細的前端項目實戰(zhàn)教學(xué)視頻），有想學(xué)習(xí)web前端的，或是轉(zhuǎn)行，或是大學(xué)生，還有工作中想提升自己能力的，正在學(xué)習(xí)的小伙伴歡迎加入

HTML5學(xué)習(xí)路線規(guī)劃：

一、HTML5基礎(chǔ)

HTML 快速入門、文本、圖像、鏈接、表格、列表、表單、框架;

二、CSS3基礎(chǔ)

CSS基礎(chǔ)語法、各種選擇器(通用選擇器、元素選擇器、id和class選擇器、后代選擇器、偽類選擇器等)、框模型與背景、文本格式化、表格、顯示與定位、瀏覽器調(diào)試

三、HTML5高級

HTML5 增強表單元素、HTML5驗證、HTML5新事件和新屬性、Canvas繪圖、HTML5 SVG、音頻和視頻處理、離線Web存儲與應(yīng)用、HTML5 拖放、Web Socket API、Geolocation API、Web Worker API

四、實戰(zhàn)技能目標

掌握JQuery核心API，HTML5 中的繪圖、音頻視頻處理、表單新特性，輕量級WEBAPP開發(fā)。

HTML5開發(fā)從根本上改變了開發(fā)者開發(fā)web和應(yīng)用的方式，從桌面瀏覽器到移動應(yīng)用，HTML5都已經(jīng)成為前端開發(fā)必不可少的語言。特別是移動互聯(lián)網(wǎng)的爆發(fā)和微信這個超級應(yīng)用對HTML5的支持，掌握HTML5語言的程序員已然成為各個互聯(lián)網(wǎng)公司的標配，薪資也是一路走高。

如果你想入門HTML5，又苦于沒有好的學(xué)習(xí)方法，可以選擇一套優(yōu)秀的教程來進行學(xué)習(xí)，讓自己少走彎路快速進入HTML5開發(fā)的行列。

學(xué)習(xí)前端的伙伴可以私信回復(fù)小編“前端”領(lǐng)取全套免費前端學(xué)習(xí)資料和學(xué)習(xí)視頻

在線咨詢

上一篇：鴻蒙開發(fā)（七十四）：頁面級狀態(tài) LocalStora
下一篇：JavaScript類型轉(zhuǎn)換機制，你了解嗎

您的項目需求

*請認真填寫需求信息，我們會在24小時內(nèi)與您取得聯(lián)系。

整合營銷服務(wù)商

學(xué)html5需要什么基礎(chǔ)？

您的項目需求

學(xué)html5需要什么基礎(chǔ)？