當前位置：首頁 > 编程资源 > 编程问答 >内容正文

编程问答

H5基本开发1——（H5简单概述）

發(fā)布時間：2023/12/29 编程问答 23 豆豆

生活随笔收集整理的這篇文章主要介紹了 H5基本开发1——（H5简单概述）小編覺得挺不錯的,現(xiàn)在分享給大家,幫大家做個參考.

html概述

HTML是用來描述網(wǎng)頁的一種語言

HTML指的是超文本標記語言Hyper Text Markup Language，是一種用于創(chuàng)建網(wǎng)頁的標準標記語言
標記語言是一套標記標簽markup tag
HTML使用標記標簽來描述網(wǎng)頁
HTML文檔的后綴名：.html或者.htm，兩種后綴名沒有區(qū)別，都可以使用
HTML5是HTML最新的修訂版本，2014年10月由萬維網(wǎng)聯(lián)盟W3C完成標準制定
HTML5的設(shè)計目的是為了在移動設(shè)備上支持多媒體

http協(xié)議：超文本傳輸協(xié)議—tcp

什么是html開發(fā)

HTML開發(fā)就是編寫以.html結(jié)尾的文檔，交給瀏覽器運行

Html文件就是【普通文本+Html標簽】，不同的html標記可以表示不同的效果
目前主要使用html文檔傳遞數(shù)據(jù)和數(shù)據(jù)的結(jié)構(gòu)，具體顯示依賴于css實現(xiàn)

瀏覽器本質(zhì)：特殊的文件查看器，能夠?qū)?/span>.html文檔中的特殊字符進行識別，自動渲染 HTML5并不是革命性的改變，而只是發(fā)展性的。而且對于之前HTML4的很多標準都是兼容的，所有通過最新HTML5標準制作的Web應(yīng)用也可以輕松的跑在老版本的瀏覽器上。HTML5標準中的確是集成了很多實用的功能比如：音視頻、本地存儲、Socket通信、動畫等都是之前應(yīng)用開發(fā)中確實感覺到Web端的雞肋才得到重視和升級的，相信如果你有相關(guān)的經(jīng)驗的話也會很有感觸。 HTML5的目標是：它通過一些新標簽，新功能為開發(fā)更加簡、獨立、標準的通用Web應(yīng)用提供了標準。新的標準解決了三大問題：瀏覽器兼容問題，解決了文檔結(jié)構(gòu)不明確的問題，解決了Web應(yīng)用程序功能受限等問題。

常見的瀏覽器

實際使用過程中，瀏覽器的種類繁多，并且統(tǒng)一瀏覽器還擁有不同的軟件版本，因此在開發(fā)學習過程中，如何適配不同瀏覽器也是我們著重注意的點。

常見編輯器

為了提高開發(fā)效率，提供不同的編寫工具前端開發(fā)：本質(zhì)就是編寫一個.html的文檔，通過瀏覽器執(zhí)行這個文檔。編寫.html文檔時采用以下的編寫工具

windows寫字板 2. webStrom 3. HBuilderX

vscode 5. Atom 6. Sublime Text

HTML開發(fā)代碼構(gòu)成?

h5開發(fā)，本質(zhì)上就是編寫一個.html格式的文檔，最終通過瀏覽器執(zhí)行該文檔，那么一個html文檔中都包含哪些代碼

標簽不區(qū)分大小寫 <標簽名屬性="值"></標簽名>
元素可以省略結(jié)束標簽
元素的屬性可以省略屬性值，例如disabled、readonly
允許屬性值不使用引號

瀏覽器驗證?

?<canvas id="ca1" width="200" height="100" style="border:2px solid #ccc;background-color:#eee">當前瀏覽器不支持全新的畫布標記</canvas> ?

可以判定當前瀏覽器是否支持Html5的新特性，如果執(zhí)行后顯示一個矩形效果，則是支持；否則在頁面顯示對應(yīng)不支持的提示信息

HTML部分

HTML：hyper text markup language hyper text：超文本，是指寫在html文檔中，并在網(wǎng)絡(luò)上傳輸?shù)?文字、圖片、視頻、音頻 markup language：標記語言

所謂標記：就是指由一對尖括號擴起來，當中具有特定英文單詞的標識，<b>abc</b> 給文字加粗顯示
標記的其他叫法：標簽元素 element

h5開發(fā)，本質(zhì)上就是編寫一個.html格式的文檔，最終通過瀏覽器執(zhí)行該文檔，那么一個html文檔中都包含哪些代碼。在線驗證網(wǎng)址validator.w3.org html文檔中只有兩種類型的標記

單標記：例如 <meta> 不能存放內(nèi)容，多是一些功能性的標記
雙標記：例如 <div> 超文本 </div> 有開始有結(jié)束，主要功能是存放內(nèi)容，可以是超文本，也可以是其他標記

<font color="red">實際開發(fā)中，我是通過這些標記符號，在文檔中表示圖片、視頻、音頻、文字，只有通過標記，才能幫助瀏覽器識別</font>

?代碼示例

<div>超文本</div>  <img>

CSS部分

CSS：cascading style sheet 層疊樣式表，用來對文檔中的標簽設(shè)置樣式，從而改變超文本在瀏覽器上的渲染效果代碼示例  <style> /* css代碼部分 */ div{ color : red } </style>  <div>紅色字體</div>

JS部分 JS：javaScript，運行在瀏覽器端的腳本語言。平時我們看到網(wǎng)頁，除了可以看以外，還可以處理一些用戶的交互行為，例如：鼠標的點擊，鍵盤的控制等等。這些功能需要通過JS來完成代碼示例 <style> /* css代碼部分 */ div{ color : red } </style>  <div onclick="fun()">js展示(超文本)</div> <script> // js代碼 function fun(){ alert("js展示成功"); } </script>

小結(jié)

html5開發(fā)就是，就是通過HTML“標簽”將“超文本”寫入文檔，再通過CSS給標簽設(shè)置樣式，完成超文本在瀏覽器上的“排版”，通過JS代碼來為標簽編寫交互腳本，完成“超文本”在瀏覽器上的人機交互功能。

HTML5 將成為 HTML、XHTML 以及 HTML DOM 的新標準
HTML5 仍處于完善之中。然而，大部分現(xiàn)代瀏覽器已經(jīng)具備了某些 HTML5 支持。

HTML5 中的一些有趣的新特性：

用于繪畫的 canvas 元素
用于媒體播放的video和audio元素
對本地離線存儲的更好的支持
新的特殊內(nèi)容元素，比如 article、footer、header、nav、section
新的表單控件，比如 calendar、date、time、email、url、search

總結(jié)

以上是生活随笔為你收集整理的H5基本开发1——（H5简单概述）的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。

简单