HTML基礎標籤

時間 2019-12-05

標籤 html 基礎標籤欄目 HTML 简体版

原文原文鏈接

1、 HTML 語言html

1.1 什麼是 HTML 語言（ HTML 概述）web

英文全稱： Hyper Text Markup Language
中文全稱：超文本標記語言
HTML 語言是製做網頁的最基本語言，而且只能經過 web 瀏覽器顯示出來。瀏覽器

1.2 HTML 文檔結構框架

HTML 文檔通常由兩部分組成：
1. 文檔所要表達的內容信息（文字、圖片等）；
2. 一系列的 HTML 標籤；佈局

1.3 HTML 標籤
1.3.1 什麼是 HTML 標籤
1. HTML 標籤是用 <> 所括住的指令，主要分爲：
單標籤： < 起始標籤 />搜索引擎

如：<br/>
雙標籤： < 起始標籤 ></ 結束標籤 >
如：<div></div>
2. 一般使用的是雙標籤。有一個起始標籤就對應有一個結束標籤。標籤內容寫在起始標籤和結束標籤之間。
如：<div> 標籤內容 </div>
3. 在元素的起始標籤中，還能夠包含「屬性」來設置元素的其餘特性。一個標籤能夠有多個屬性 , 每一個屬性之間用空格隔開。
如：<div 屬性名 =" 屬性值 "></div>
例如：
<div class="wrap" id="wrap"></div>
4. 每一對雙標籤之間能夠嵌套，但不能交叉。
如：編碼

正確：
<div>
<p></p>
</div>
錯誤：
<div>
<p>
</div>
</p>
1.4 編碼器
1.4.1 WebStorm 源碼主體標籤含義
<!DOCTYPE> ：
是一個聲明不是 HTML 標籤；它是用來告訴 web 瀏覽器要使用哪一個 HTML 版原本對頁面進行編寫。spa

<html> ：
<html>是文檔標識符，它是成對出現的，首標籤<html>和尾標籤</html>分別位於 HTML 文檔的最前面和最後面，明確地表示文檔是以超文本標識語
言（ html) 編寫的。該標籤不帶有任何的屬性。
<head> ：
<head>標籤用於定義文檔的頭部，它是全部頭部元素的容器。<head> 中的元素能夠引用腳本、指示瀏覽器在哪裏找到樣式表、提供元信息等等。
<meta> ：
<meta>標籤位於文檔的頭部，用於定義文件信息，對網頁文件進行說明。其中name屬性主要用於描述網頁，與之對應的屬性值爲content，content中
的內容主要是便於搜索引擎機器人查找信息和分類信息用的。
<body> ：
<body>標籤用於定義文檔的主體，即在瀏覽器上看到的網頁內容。orm

1.5 HTML 標籤的使用
1. HTML 註釋
註釋內容可插入文本中任何位置，其內容不在網頁中顯示，只在源碼文檔中供開發者備註使用。
　　　　　　 方法適用於文檔主體部分
　　　　　　// 註釋內容
　　　　　　/* 註釋內容 */ 方法適用於文檔引用標籤部分
2. 特殊字符
在 HTML 代碼中直接輸入一些特殊字符是沒有效果的，須要用專有的代碼標記。
　　　　　　  
　　　　　　< 
　　　　　　> 
　　　　　　© 
　　　　　　® 
　　　　　　& 
　　　　　　 
3. div 塊標籤
<div> 這是一個 div 塊，一般用於佈局 </div>
4. 正文標題標籤
　　　　　　<h1>heading</h1>
　　　　　　<h2>heading</h2>
　　　　　　<h3>heading</h3>
　　　　　　<h4>heading</h4>
　　　　　　<h5>heading</h5>
　　　　　　<h6>heading</h6>
注意：只有 h1~h6 六個標籤，沒有 h7...
5. 文本節標籤
　　　　　　<span> 這是一個文本節 </span>
6. 強調標籤
　　　　　　<strong> 增強語氣 </strong>
7. 圖片標籤
　　　　　　<img src=" 圖片地址 "/>
8. 段落標籤
　　　　　　<p> 這是一個段落 </p>
9. 超級連接標籤
　　　　　　<a href=" 連接地址 "> 超連接，打開新窗口 </a>
10. 文本域
　　　　　　<textarea> 文本內容 </textarea>
11. 無序列表標籤
　　　　　　<ul>
　　　　　　　　<li> 第一個 </li>
　　　　　　　　<li> 第二個 </li>
　　　　　　　　<li> 第三個 </li>
　　　　　　</ul>
12. 有序列表標籤
　　　　　　<ol>
　　　　　　　　<li> 第一個 </li>
　　　　　　　　<li> 第二個 </li>
　　　　　　　　<li> 第三個 </li>
　　　　　　</ol>
13. 自定義列表
　　　　　　<dl>
　　　　　　　　<dt> 自定義列表項 </dt>
　　　　　　　　<dd> 自定義列表項的定義 </dd>
　　　　　　</dl>
14. table 表格
　　　　　<table>
　　　　　　<tr>
　　　　　　　　<td> 娛樂項目 </td>
　　　　　　　　<td> 項目支出 </td>
　　　　　　</tr>
　　　　　　<tr>
　　　　　　　　<td> 聚餐 </td>
　　　　　　　　<td>200 元 </td>
　　　　　　</tr>
　　　　　</table>
15. form 表單
<form>
表單輸入控件
</form>
16. 控制標籤
<label> 控制標籤，平時無效果，用做標記使用 </label>
17. 表單輸入控件
<input type="text"> 
<input type="password"> 
<input type="radio"> 
<input type="button" value=" 點擊 "> 
<input type="checkbox"> 
<input type="submit"> 
<input type="reset"> 
<input type="file"> 
button 和 submit 的區別：
button 就是一個普通按鈕，沒有任何功能。而 submit 在用戶點擊後會自動提交 form 表單。
18. 下拉列表
<select>
　　<option> 川菜 </option>
　　<option> 粵菜 </option>
　　<option> 北方菜 </option>
　　<option> 上海菜 </option>
　　<option> 西餐 </option>
　　<option> 泰國菜 </option>
</select>
19. 內聯框架
<iframe src=" 須要顯示的網頁連接地址 "></iframe>htm

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。