這篇文章主要為大家展示了“Web開發(fā)基礎(chǔ)之HTML是什么”，內(nèi)容簡而易懂，條理清晰，希望能夠幫助大家解決疑惑，下面讓小編帶領(lǐng)大家一起研究并學(xué)習(xí)一下“Web開發(fā)基礎(chǔ)之HTML是什么”這篇文章吧。

成都創(chuàng)新互聯(lián)從2013年開始，先為洛寧等服務(wù)建站，洛寧等地企業(yè)，進行企業(yè)商務(wù)咨詢服務(wù)。為洛寧企業(yè)網(wǎng)站制作PC+手機+微官網(wǎng)三網(wǎng)同步一站式服務(wù)解決您的所有建站問題。

HTML 提供頁面上的內(nèi)容（結(jié)構(gòu)和內(nèi)容）

CSS 對網(wǎng)頁進行美化（樣式）

JavaScript對網(wǎng)頁上的內(nèi)容進行控制（控制）

常用開發(fā)工具：

輕量文本型：VSCode、Sublime

重量IDE型：WebStrom

什么是HTML

HTML（英文 Hyper Text Markup Language 的縮寫）中文譯為超文本標(biāo)記語言

通過HTML標(biāo)簽對網(wǎng)頁中的文本、圖片、聲音等內(nèi)容進行描述

打開網(wǎng)絡(luò)上的一個頁面，通過瀏覽器調(diào)試工具查看源代碼

HTML的格式

基本格式

html標(biāo)簽：所有html標(biāo)簽的根節(jié)點

head標(biāo)簽：描述網(wǎng)頁的一些信息，里面的內(nèi)容不會被顯示呈現(xiàn)

title標(biāo)簽：網(wǎng)頁的標(biāo)題

body標(biāo)簽：頁面的主題部分，主要編寫開發(fā)的內(nèi)容

Tip:通過編輯器快速創(chuàng)建html的頁面結(jié)構(gòu)

在vscode中新建一個html文件后，輸入！按tab鍵，可以快速生成一個HTML5標(biāo)準的一個頁面結(jié)構(gòu)。

雙標(biāo)簽

語法格式

<標(biāo)簽名> 在整個標(biāo)簽的最前面，稱為“開始標(biāo)簽（start tag）”

</標(biāo)簽名> 在整個標(biāo)簽的最后面，稱為“結(jié)束標(biāo)簽（end tag）”

結(jié)束標(biāo)簽只是比開始標(biāo)簽，在前面多了一個關(guān)閉符“/”。

單標(biāo)簽

語法格式

例如

UTF-8 是目前最常用的字符集編碼方式，常用的字符集編碼方式還有 gbk 和 gb2312

GB2312 簡單中文  包括6763個漢字

BIG5   繁體中文 港澳臺等用

GBK 包含全部中文字符    是 GB2312 的擴展，加入對繁體字的支持，兼容 GB2312

UTF-8 則包含全世界所有國家需要用到的字符

Tip：以后我們統(tǒng)一使用UTF-8字符集就可以了，避免出現(xiàn)字符集不統(tǒng)一而引起亂碼的情況。

標(biāo)題標(biāo)簽

語法

標(biāo)題標(biāo)簽按1-6大小從大到小，如下圖 默認提供1-6個標(biāo)題標(biāo)簽，如果寫h7則是普通文字

段落標(biāo)簽

單詞縮寫： paragraph  段落

使用段落標(biāo)簽，可以使網(wǎng)頁中的文本文字，呈現(xiàn)出一個一個段落的格式。

語法：

水平線標(biāo)簽

換行標(biāo)簽

單詞縮寫：  break   打斷 ,換行在HTML中，默認換行是需要在瀏覽器窗口的最右端才會自動換行，這樣在每個設(shè)備中呈現(xiàn)的效果不一致。如果需要進行某段文本的強制換行，就需要使用到換行標(biāo)簽。

語法：

練習(xí)：實現(xiàn)一個簡單新聞頁面

div span標(biāo)簽

div   division  的縮寫   分割， 分區(qū)的意思  其實有很多div 來組合網(wǎng)頁。 塊級元素

span  跨度，跨距；范圍，行內(nèi)元素

語法

標(biāo)簽屬性

在使用HTML制作網(wǎng)頁的時候，如果想讓標(biāo)簽提供更多的信息，可以使用標(biāo)簽的一些屬性進行設(shè)置。

語法

例

width  屬性，值 200   控制寬度

align 屬性，值 left     控制橫向?qū)ζ浞绞?/p>

默認hr標(biāo)簽占據(jù)了整行，設(shè)置以上屬性以后寬度就只有設(shè)置的200

默認hr是居中對齊，設(shè)置左對齊

圖片標(biāo)簽

單詞縮寫：image 圖像（單標(biāo)簽）

語法

通過src屬性，進行設(shè)置圖像文件的路徑和文件名。是img標(biāo)簽的必須屬性。

圖片標(biāo)簽屬性

src可以是網(wǎng)絡(luò)路徑，可以的本地絕對路徑或者相對路徑，前提是路徑存在圖片有效，否則使用設(shè)置的文本代替

鏈接標(biāo)簽

單詞縮寫：anchor 錨

語法

示例

跳轉(zhuǎn) 默認直接覆蓋當(dāng)前頁面跳轉(zhuǎn)，加target="_blank"新打開一個頁面跳轉(zhuǎn)

跳轉(zhuǎn)需要加協(xié)議例如http否則會在當(dāng)前目錄絕對路徑加跳轉(zhuǎn)鏈接

特殊字符標(biāo)簽

html中一些標(biāo)簽，具有特殊含義，會被瀏覽器直接解析 ,如果需要輸出這些標(biāo)簽，需要使用到轉(zhuǎn)義、替代語法。

例如需要在頁面顯示：  <p>標(biāo)簽經(jīng)常用于段落 直接寫在html文本里面會把<p>當(dāng)成標(biāo)簽解析，頁面并不會顯示

需要寫成如下格式

注釋標(biāo)簽

注釋標(biāo)簽，可以給HTML文檔中添加一些便于閱讀和理解的文字，并且此標(biāo)簽中的內(nèi)容，不會直接展示出來，只有通過源代碼的方式才可以看到。

語法

也可以直接選中需要注釋的語句 ctrl+/注釋

列表標(biāo)簽

語法

①在<ul></ul>標(biāo)簽中，只能嵌套<li></li>標(biāo)簽，其他標(biāo)簽的直接嵌套是語法是不被允許的。

②<li></li>標(biāo)簽中作為一個容器，可以容納其他的標(biāo)簽元素。

③無序列表具有默認樣式，可以CSS進行修飾。

頁面顯示

ol有序標(biāo)簽

在前面加序號

頁面顯示

表格標(biāo)簽

語法

表格屬性

①可以使用th標(biāo)簽設(shè)置表頭 　　即把td改成th可以把表頭設(shè)置成標(biāo)題模式加粗

②之后可以使用CSS修飾表格的樣式

示例：

一個主機列表表格

頁面顯示

修改設(shè)置

顯示效果

表單

在HTML中，form標(biāo)簽用來定義一個表單。用來實現(xiàn)用戶的相關(guān)信息的收集和傳遞，和后端進行交互。form中的所有內(nèi)容都會被提交給服務(wù)器。

語法：

常用屬性：

action  值為提交到后端接收的URL地址

method 設(shè)置表單的提交方式   值為get或者post

表單控件組成

表單中的提供了多種表單空間，單行文本輸入框、密碼輸入框、復(fù)選框、提交按鈕、重置按鈕等。

input控件

input控件為表單中，最常使用的，也是需要重點掌握的?；緲?biāo)簽屬性為type屬性

用來定義不同的控件類型。

其他常見屬性

textarea控件（文本域）

當(dāng)需要輸入大量信息的時候，就可以使用textarea標(biāo)簽。實現(xiàn)多行文本的輸入框。

以上是“Web開發(fā)基礎(chǔ)之HTML是什么”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內(nèi)容對大家有所幫助，如果還想學(xué)習(xí)更多知識，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道！

分享文章：Web開發(fā)基礎(chǔ)之HTML是什么
標(biāo)題鏈接：http://aaarwkj.com/article16/gdecgg.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供靜態(tài)網(wǎng)站、電子商務(wù)、響應(yīng)式網(wǎng)站、移動網(wǎng)站建設(shè)、關(guān)鍵詞優(yōu)化、網(wǎng)站建設(shè)

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源： 創(chuàng)新互聯(lián)