1、HTML是超文本標(biāo)記語(yǔ)言。(Hyper Text Markup Language)
2、HTML不是編程語(yǔ)言,而是一種標(biāo)記性語(yǔ)言,標(biāo)記語(yǔ)言是一套標(biāo)記標(biāo)簽,HTML使用標(biāo)記標(biāo)簽描述網(wǎng)頁(yè)。
3、html文檔的基本結(jié)構(gòu)
<!DOCTYPE html>
<html>
<head>
<meta/>
<title></title>
</head>
<body>
</body>
</html>
4、<!DOCTYPE html>引用官方的DTD文件,主要是對(duì)標(biāo)簽引用的約束。但HTNL5不需要應(yīng)用嚴(yán)格意義上的DTD文件。
5、html重要標(biāo)簽
??(1)head標(biāo)簽是HTML文檔的頭部標(biāo)簽,成對(duì)出現(xiàn)<head>...</head>
??(2)body標(biāo)簽是HTMl主題部分標(biāo)簽,成對(duì)出現(xiàn)<body>...</body>
-
head標(biāo)簽的主要元素
| 標(biāo)簽 | 用法 |
|---|---|
| title | 該元素用于定義文檔標(biāo)題 |
| meta | 用于HTML頁(yè)面元數(shù)據(jù) |
| scripe | 用于包含JavaScript腳本 |
| link | 用于鏈接外部css資源文件 |
| style | 用于定義內(nèi)部css樣式 |
?(1) title標(biāo)簽
- 能在瀏覽器窗口中所能看到的,title標(biāo)簽使用戶(hù)最看重的標(biāo)簽,是當(dāng)前頁(yè)面的主旨,應(yīng)該將網(wǎng)站的最核心內(nèi)容寫(xiě)到title中。
<title>我的第一個(gè)網(wǎng)頁(yè)</title>
?(2) meta標(biāo)簽
- 用于定義頁(yè)面原信息
| 屬性 | 用法 |
|---|---|
| http-equiv | 指定原信息的名稱(chēng),該屬性指定的名稱(chēng)具有特殊意義,它可以向?yàn)g覽器傳回一些有用的信息,幫助瀏覽器正確地處理網(wǎng)頁(yè)內(nèi)容 |
| content | 指定元信息名稱(chēng),該名稱(chēng)值可以隨意指定 |
| name | 指定元信息的值 |
<meta http-equiv="Content-type" content="text/html;charset=gb2312"/>
<meta name = "author" content = "zqn"/>
<meta name = "keywords" content="夢(mèng)想,加油"/>
<meta name = "description" content="為了夢(mèng)想成功要加油"/>
6、常見(jiàn)的塊級(jí)標(biāo)簽
-
標(biāo)題標(biāo)簽(從h1到h6字體大小依次變?。?/h5>
<body>
<h1>一級(jí)標(biāo)題</h1>
<h2>二級(jí)標(biāo)題</h2>
<h3>三級(jí)標(biāo)題</h3>
<h4>四級(jí)標(biāo)題</h4>
<h5>五級(jí)標(biāo)題</h5>
<h6>六級(jí)標(biāo)題</h6>
</body>
-
段落標(biāo)簽(這三個(gè)p標(biāo)簽分別會(huì)成三個(gè)段落顯示)
<body>
<h2>歌手曲目</h2>
<p>第一首:岑寧兒 追光者</p>
<p>第二首:jam 七月上</p>
<p>第三首:何潔 你要幸福啊</p>
</body>
?呈現(xiàn)效果:
歌手曲目
第一首:岑寧兒 追光者
第二首:周柏豪 走狗
第三首:何潔 你要幸福啊
-
水平線標(biāo)簽(有一條水平線,用于分割)
<hr/>
-
有序列表標(biāo)簽
<h3>我喜歡吃的水果</h3>
<ol>
<li>橙子</li>
<li>圣女果</li>
<li>柚子</li>
</ol>
?呈現(xiàn)效果:
我喜歡吃的水果
1.橙子
2.圣女果
3.柚子
-
無(wú)序列表標(biāo)簽
<h3>我想去的地方</h3>
<ul>
<li>北京</li>
<li>上海</li>
</ul>
?呈現(xiàn)效果:
我想去的地方
- 北京
- 上海
-
分區(qū)標(biāo)簽(有幾個(gè)div標(biāo)簽整體頁(yè)面就會(huì)被分為幾塊,對(duì)網(wǎng)頁(yè)進(jìn)行整體分塊布局)
<div>頭部?jī)?nèi)容</div>
<div>導(dǎo)航內(nèi)容</div>
<div>底部?jī)?nèi)容</div>
7、常見(jiàn)的行級(jí)標(biāo)簽(按行逐一顯示,前后不會(huì)自動(dòng)換行)
-
文本格式化元素
| 標(biāo)簽 | 用法 |
|---|---|
| <b> | 定義粗體文本 |
| <i> | 定義斜體文本 |
| < em > | 定義強(qiáng)調(diào)文本,實(shí)際效果與斜體差不多 |
| < strong > | 定義粗體文本,與<b>的作用基本相同 |
| < small > | 定義小號(hào)文本 |
| < sub > | 定義下標(biāo)文本 |
| < sup > | 定義上標(biāo)文本 |
| < bdo > | 定義文本顯示方向,內(nèi)有dir屬性,只能取ltr或rtl |
<ul>
<li><b>水</b>:H<sub>2</sub>O</li>
<li><i>氧氣</i>:O<sup>2</sup></li>
<ul>
?呈現(xiàn)效果:
- 水:H2O
-
氧氣:O2
-
超鏈接標(biāo)簽
<a href="鏈接地址" target="目標(biāo)窗口">鏈接文本或圖片</a>
常用屬性:
| 屬性 | 作用 | |
|---|---|---|
| href | 指定超鏈接所關(guān)聯(lián)的另一個(gè)資源 | |
| target | 指定框架集中的哪一個(gè)框架裝載另一個(gè)資源,該屬性可以是_self、_blank、_top、_parent四個(gè)值,分別代表自身、新窗口、頂層框架、父框架來(lái)裝載新資源 | ` |
<a target="_blank">百度網(wǎng)頁(yè)</a><br/>
/*這條語(yǔ)句就是點(diǎn)擊百度網(wǎng)頁(yè)就會(huì)在新的窗口打開(kāi)百度頁(yè)面*/
-
圖像標(biāo)簽
<img src="圖片地址" alt="提示文字">
<p><a target="_blank">
<img src="lovely.jpg" alt="可愛(ài)的女生頭像"/></a></p>
-
span標(biāo)簽(div標(biāo)簽和p標(biāo)簽)
<span>文本等行級(jí)內(nèi)容</span>
-
換行標(biāo)簽
< br/ >換行
-
常用的特殊符號(hào)
| 空格 |   |
| 大于(>) | > |
| 小于(<) | < |
| 引號(hào)(“”) | " |
| 版權(quán)號(hào) | © |