一、HTML語言
1、HTML 超文本標記語言
在HTML中存在大量的標籤，我們用HTML提供的標籤，將要顯示在網頁中的內容包含起來，就構成了我們的網頁。
與CSS語言相配合使用，HTML決定要顯示的內容，CSS控制網頁中顯示的效果。
HTML+CSS 構成靜態網頁，JS + JQuery 可以實現動態網頁
2、開始動手寫HTML頁面
1）首先隨便見一個記事文件
2）將創建的文件後綴改爲htm或 html
3）開始基本的框架標籤
<html>
<head>
<title>My first HTML</title>
</head>
<body>
人生得意須盡歡，
莫使金樽空對月。
</body>
</html>
2、HTML的標籤
1）p ------ 段落標籤
<p>人生得意須盡歡，</p>
<p>莫使金樽空對月。</p>2）  -----空格標籤
<p>莫使金樽 空對月。</p>3）h# ---- #=1~6 ----標題標籤
<h1>我是標題</h1>
<h2>我是標題</h2>
<h3>我是標題</h3>
<h4>我是標題</h4>
<h5>我是標題</h5>
<h6>我是標題</h6>
<h6>我是標題</h6>
4）<img src=path /> ----圖片標籤，HTML中少有的自己結束的標籤
<img src="C:\Users\tufeiax\Desktop\011.jpg" width="200px" height="200px" border="1px" title="還行吧" alt="原來是美女帥哥啊" />
src：顯示圖片的路徑
width：圖片的寬度 單位--px
height：圖片的高度 單位--px
title：鼠標移動到圖片範圍時顯示的內容
border ： 圖片邊框 單位 --px
alt： 當圖片出現顯示失敗時顯示的內容
5）<!-- 要註釋的內容 --/> 註釋
<!-- 屬性 = "值"-->6）<hr/> ----水平分割線
7）<br/> ----換行標籤 與p 段落標籤不同的是，p分割的兩行間隙比較大
8）特殊符號： > ---> <---< & ----& 空格---- 
5>3
3<5
9）font ----字體標籤
<font> </font> 屬性： size ---1~7 ； color ---顏色 face---字體系列
<font size="5" color="green" face="仿宋"> 跳樓瘋搶價只需</font> <font size="7" color="red">1</font>元，老婆抱回家！10）字體標籤
<b> 文本內容 </b> <br/> ----加粗文本內容 ，並換行
<i> 文本內容 </i> <br/> ----意大利斜體 ，並換行
<tt> 文本內容 </tt> <br/> ---
<u> 文本內容 </u> <br/> ---加下劃線
<sup> <sub> ---定義上、下標
<s> 文本內容 </s> ---加刪除線
11）pre 與 code 標籤配合使用，按照代碼格式顯示
12）marquee ---移動標籤 現在已經很少用，許多瀏覽器不兼容了
<marquee direction="right" behavior="slide"><img src="042.jpg" width="500px" height="800px"/></marquee>
3、語言特點
1）分爲單元塊
2）一般都是有始有終。有些是自己結束的比如 <img /> 、<hr/>
3）可以嵌套使用：
<p><b>我的好老婆！</b></p>4）不區分大小寫
4、表現各標籤的特徵爲屬性 屬性 = 值
值一般用引號括起來， 屬性之間至少要有一個空格
5、a標籤的使用
a標籤： 超鏈接
屬性：
作用1：網頁鏈接
href---要連接的地址
target ----打開網頁的方式 值：_blank ---打開新網頁跳轉； _slef或默認 -----在當期那網頁跳轉
<a href="http://www.baidu.com" target="_blank">百度</a>作用2： 實現當前網頁內的跳轉：
<a name="頂端" href="#底端">回到底端</a>
<br/><br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
<a name="底端" href="#頂端">回到頂端</a>作用3：網頁間的跳轉（從某個網頁跳到另一個網頁的某個位置
<a name="碗裏來" href="a標籤的使用.html#回來">快到碗裏來</a><a name="回來" href="html網頁標籤學習.html#碗裏來">快到碗裏去</a><a href="mailto:[email protected]">發送郵件到251792911</a>6、html背景 ----body屬性
1）text屬性： 設置文本的顏色
<body text="green"> 文本</body>
2）link屬性：設置a標籤裏超鏈接的顏色 alink屬性：設置a標籤裏超鏈接點擊時的顏色 vlink屬性：設置a標籤裏超鏈接點擊後的顏色
3）bgcolor屬性：設置文本背景顏色
<body bgcolor="black">文本</body>
4）background屬性：設置背景圖片
7、html的列表
1）無序列表 ：ul的屬性： type---列表標題的樣式
<ul>
<li>表</li>
</ul>
2）有序列表 ul的屬性： type---列表標題的樣式
<ol>
<li>表 </li>
</ol>
3）自定義列表： ul的屬性： type---列表標題的樣式
<dl>
<dt>章</dt>
<dd>節</dd>
</dl>
8、html表格：
1）table的屬性：bgcolor--背景顏色、border--邊框、bordercolor--邊框顏色、cellspacing--單元格的間隔、cellpadding--內容與單元格的間隔、width--寬、height--高
<table border="1px" cellspacing="0px" cellpadding="5px">
<tr>
<td><a href="#">超鏈接</a></td>
<td>星期一</td>
<td>哈哈哈</td>
</tr>
<tr>
<td>呵呵</td>
<td>逗比</td>
<td><img src="1.jpg" width="30px" height="30px"</td>
</tr>
</table>
2）跨行跨列的表格 ：給單元格加個屬性
跨列的表格：colspan
<tr>
<td colspan="2">學生成績</td>
</tr><tr>
<td rowspan="2">張三</td>
<td>語文</td>
<td>98</td>
</tr>
<tr>
<td>數學</td>
<td>95</td>
</tr>如果想要第一行文本加粗並居中：將<td></td> 換成 <th></th> 代表表格的標題即可
<td>的屬性： align--居左/中/右、valign--居上/中/下、bgcolor--背景顏色、width--寬、height--高、colspan--佔幾列、rowspan--佔幾行