中字幕视频在线永久在线,最新免费av在线观看,最近免费mv在线观看,亚洲乱码一区av春药高潮,专区,国产激情毛片,国产成人

IT培訓(xùn)-高端面授IT培訓(xùn)機(jī)構(gòu)
云和教育：云和數(shù)據(jù)集團(tuán)高端IT職業(yè)教育品牌
  • 國家級
    全民數(shù)字素養(yǎng)與技能培訓(xùn)基地
  • 河南省
    第一批產(chǎn)教融合型企業(yè)建設(shè)培育單位
  • 鄭州市
    數(shù)字技能人才（碼農(nóng)）培養(yǎng)評價(jià)聯(lián)盟

詳解HTML5，知道了這些可以成為前端工程師

  • 發(fā)布時(shí)間：
    2019-06-18
  • 版權(quán)所有：
    云和教育
  • 分享：

HTML5并不僅僅是作為HTML標(biāo)記語言的一個(gè)最新版本,更重要的是它制定了web應(yīng)用開發(fā)的一系列標(biāo)準(zhǔn), 成為第一個(gè)將web作為應(yīng)用程序開發(fā)平臺的HTML語言。

配圖1 HTML5的優(yōu)勢.jpg

HTML5定義了一系列的新元素, 如新語義標(biāo)簽, 智能表單, 多媒體標(biāo)簽, 可以幫助開發(fā)者創(chuàng)建互聯(lián)網(wǎng)應(yīng)用, 同時(shí)有令人眼花的css3, 還提供了一些JavaScript的API(應(yīng)用程序接口), 列如: 地理定位 重力感應(yīng), 硬件訪問, 可以在瀏覽器內(nèi)實(shí)現(xiàn)類似于原生應(yīng)用, 制作webAPP, 甚至結(jié)合Canvas可開發(fā)一些網(wǎng)頁板的小游戲啊。

配圖2 什么是HTML5.jpg

H5其實(shí)只是一個(gè)泛稱, 是由HTML5+CSS3+JavaScript等技術(shù)結(jié)合而成的一個(gè)應(yīng)用開發(fā)平臺。

1.HTML5的兼容性

新增的部分有兼容性的問題, 并不是所有的html5都是IE9兼容的, 有一些屬性是需要IE10或者更高級的瀏覽器才能兼容, 所以, html5更多應(yīng)用在移動(dòng)端的方面, 因?yàn)橐苿?dòng)端搭載的瀏覽器比較高級。

2.HTML5的骨架

配圖3 云和數(shù)據(jù)HTML5課程升級.jpg

代碼示例:

<!DOCTYPE html>　　<html>　　　　<head> 　　　　 <meta charset=”UTF-8″> 　　 　　<title>Title</title> 　　　　<style> 　　　　</style>　　　　</head>　　　　<body>　　　　</body>　　</html>

HTML5骨架是沒有兼容的問題的。

反問：如果在xt的文檔DTD里面書寫h5的內(nèi)容，會(huì)帶來兼容問題么？

答：跟你用什么文檔DTD沒有關(guān)系 主要跟瀏覽器有關(guān)系。

3.HTML5新增的標(biāo)簽

新增的6大結(jié)構(gòu)標(biāo)簽：

（1）header 網(wǎng)站頭部 （2）nav 導(dǎo)航欄（3）section 類似于div （4）aside 文件側(cè)欄（5）article 文章/文本內(nèi)容（6）footer 網(wǎng)站腳部

作用：跟div一模一樣 ，就是增加了語義性更加利于seo優(yōu)化。

配圖4 云和數(shù)據(jù)HTML5培訓(xùn).jpg

由于html5新增的標(biāo)簽有兼容問題，所以我們需要做兼容！怎么實(shí)現(xiàn)？

（1）利用document.creatElement()去創(chuàng)建html5的新標(biāo)簽，同時(shí)設(shè)置成塊元素

<!–[if lt IE 9]>

<script type=”text/javascript”>

var e = “abbr, article, aside, audio, canvas, datalist, details, dialog, eventsource, figure, footer, header, hgroup, mark, menu, meter, nav, output, progress, section, time, video”.split(‘, ‘);

var i= e.length;

while (i–){

document.createElement(e[i])

}

</script>

<![endif]–>

（1）借助于第三方的JS框架 =>html5shiv.min.js （推薦）配合IE的hack實(shí)現(xiàn)最佳兼容。

<!–[if lt IE 9]>

<script src=”js/html5shiv.min.js”></script>

<![endif]–>

注明：還有一些新增的用到的不多，所以了解即可，上述六個(gè)結(jié)構(gòu)標(biāo)簽是最為常用的。

配圖5 學(xué)習(xí)HTML5要多長時(shí)間.jpg

4.HTML5新增的智能表彰

以前學(xué)過 type =text ，submit ，reset，radio。。。。

type=”email” 限制用戶輸入必須為Email類型

type=”url” 限制用戶輸入必須為URL類型

type=”date” 自動(dòng)生成一個(gè)日期控件

type=”number” 限制用戶輸入必須為數(shù)字類型

type=”range” 產(chǎn)生一個(gè)進(jìn)度條的表單

type=”search” 產(chǎn)生一個(gè)搜索意義的表單

type=”color” 生成一個(gè)顏色選擇表單

總結(jié)：智能表單的兼容比較大，在移動(dòng)端用的較多，移動(dòng)端會(huì)自動(dòng)調(diào)取手機(jī)本身的控件（不同手機(jī)之間會(huì)略有不同，但如果需要高度自定義，就需要用JS去寫了）。