什么是HTML?
HTML 指的是超文本標(biāo)記語(yǔ)言: HyperText Markup Language
HTML 使用標(biāo)記標(biāo)簽來(lái)描述網(wǎng)頁(yè)
HTML文件后綴名:htm,html
HTML編輯器:sublime,HBuilderX
HTML使用基礎(chǔ)
HTML初識(shí)
1.標(biāo)簽 - 承載內(nèi)容
2.層疊樣式表 - 渲染頁(yè)面
3.JavaScript - 交互式行為
HTML的格式
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
</body>
</html>
注釋?zhuān)涸贖TML中注釋使用
<!-- -->
HTML 簡(jiǎn)單操作
1.標(biāo)題
HTML 標(biāo)題(Heading)是通過(guò)<h1> - <h6> 標(biāo)簽來(lái)定義的
2.段落
HTML 段落是通過(guò)標(biāo)簽 <p> 來(lái)定義的
<p>這是一個(gè)段落</p>
<p>這是另外一個(gè)段落</p>
<br>換行
3.列表
1)有序列表<ol>
<ol>
<li>Coffee</li>
<li>Milk</li>
</ol>
顯示結(jié)果
1.Coffee
2.Milk
2)無(wú)序列表<ul>
<ul>
<li>Coffee</li>
<li>Milk</li>
</ul>
顯示結(jié)果
- Coffee
- Milk
3)自定義列表<dl>
<dl>
<dt>Coffee</dt>
<dd>- black hot drink</dd>
<dt>Milk</dt>
<dd>- white cold drink</dd>
</dl>
顯示結(jié)果
Coffee
- black hot drink
Milk
- white cold drink
注意:列表中可以疊加
4.表格
鍵入<table<tr*>td*>后tab鍵插入表格,<caption>表格名稱(chēng)</caption>
rowspan="2"為列并格2格,align="center" 為居中(align=" "為對(duì)齊)
rowspan="2"為行并格2格
<!--table<tr*4>td*5 -->
<table border="1">
<caption>學(xué)生考試成績(jī)</caption>
<thead>
<tr>
<th width="120">姓名</th>
<th width="100">數(shù)學(xué)</th>
<th width="100">語(yǔ)文</th>
<th width="100">物理</th>
<th width="100">化學(xué)</th>
</tr>
</thead>
<tr>
<td>王大錘</td>
<td>89</td>
<td colspan="2" align="center">45</td>
<td>56</td>
</tr>
<tbody>
<tr>
<td rowspan="2"align="center">李四</td>
<td>35</td>
<td>78</td>
<td>76</td>
<td>89</td>
</tr>
<tr>
<td>78</td>
<td>66</td>
<td>98</td>
<td>56</td>
</tr>
</tbody>
4.字符實(shí)體
& - &; 空格 -  ;等,見(jiàn)菜鳥(niǎo)教程
5.圖像
<img src="url" alt="some_text">,src后面是圖片地址,可以是本地地址(相對(duì)路徑),也可以是網(wǎng)絡(luò)地址。alt后面是地址失效后顯示的文本內(nèi)容,可自定義
<img src="pulpit.jpg" alt="Pulpit rock" width="304" height="228">
width,height分別調(diào)整圖像寬度和高度
6.超鏈接
HTML 使用超級(jí)鏈接與網(wǎng)絡(luò)上的另一個(gè)文檔相連。幾乎可以在所有的網(wǎng)頁(yè)中找到鏈接。點(diǎn)擊鏈接可以從一張頁(yè)面跳轉(zhuǎn)到另一張頁(yè)面。
HTML使用標(biāo)簽 <a>來(lái)設(shè)置超文本鏈接,在標(biāo)簽<a> 中使用了href屬性來(lái)描述鏈接的地址。
<a >訪問(wèn)菜鳥(niǎo)教程</a>
使用 target 屬性,你可以定義被鏈接的文檔在何處顯示。
下面的這行會(huì)在新窗口打開(kāi)文檔:
<a target="_blank">訪問(wèn)菜鳥(niǎo)教程!</a>
6.函數(shù)
HTML中函數(shù)function 函數(shù)名() {函數(shù)體}
自帶函數(shù)window
7.按鍵
在HTML中使用<button></button>來(lái)創(chuàng)建按鍵