先看一下HTML整體結(jié)構(gòu)
首先創(chuàng)建一個以.html結(jié)尾的文件
注意：<!-甸鸟、- --> 代表注釋
<!DOCTYPE html> <!-- 文檔聲明，需要頂格書寫 -->
<html> <!-- 全部內(nèi)容藕各，都需要放在這對標簽里 -->
<head> <!-- 網(wǎng)頁頭部，對網(wǎng)頁進行設(shè)置 -->
<meta charset="utf-8"> <!-- 設(shè)置網(wǎng)頁編碼 -->
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <!-- 設(shè)置縮放，針對移動端 -->梗脾、
<meta http-equiv="X-UA-Compatible" content="ie=edge"> <!-- ie瀏覽器以最高版本渲染 -->
<title>初識網(wǎng)頁</title> <!-- 設(shè)置網(wǎng)頁標題 -->
</head>
<body> <!-- 網(wǎng)頁主體，顯示在網(wǎng)頁上的內(nèi)容 -->
這里放內(nèi)容
</body>
</html>
相信看了上面這段代碼盹靴，應(yīng)該對HTML基本結(jié)構(gòu)有了大致的了解炸茧。
那接下來我們看一下一些基本的標簽
基本標簽
注意，這里僅僅只展示了一小部分經(jīng)常使用的標簽
元素標簽分為兩類：
- 塊級元素：獨占一行稿静，默認寬與父級寬相同
- 行內(nèi)元素：元素之間排列在一行梭冠，不能設(shè)置寬高，由內(nèi)容撐開改备。
一些塊級元素
這里只列出了一些常用的
- 標題
<h1>這是一級標題</h1>
<h2>這是二級標題</h2>
...
<h6>這是六級標題</h6>
注：標題從一級標題到六級標題控漠。
- 段落
<p>這是段落</p>
3.塊級容器
<div>塊級容器，沒有默認樣式</div>
- 表單
<form>...</form>
- 列表
<!-- 無序列表 -->
<ul>
<li>a</li>
...
<li>z</li>
</ul>
<!-- 有序列表 -->
<ol>
<li>1</li>
...
<li>n</li>
</ol>
<!-- 定義列表 -->
<dl>
<dt>項</dt>
<dd>描述</dd>
...
</dl>
- 表格
<!-- 基本結(jié)構(gòu) -->
<table>
<tr>
<td>列1</td>
<td>列2</td>
</tr>
</table>
一些常用行內(nèi)元素
- 錨點
<a href="">...</a>
- 圖片
<img src="" alt="">
注：img雖然是行內(nèi)元素，但可以設(shè)置寬高
- 常用內(nèi)聯(lián)標簽
<span>...</span>
標簽語義化
在布局中盐捷，盡量使用帶語義的標簽偶翅，目的是為了搜索引擎更好的理解網(wǎng)頁結(jié)構(gòu)，提高排名（SEO）碉渡，也為了代碼的維護和閱讀聚谁。
最后，一定要多敲代碼滞诺，都敲出來在瀏覽器看看顯示效果形导。
