1.編寫html步驟
第一步:新建一個記事本.（以.html結尾)
第二步:右擊選擇打開方式為文本文檔 第三步:編寫內容
<html>
<head></head>
<body>
hello html!
</body>
</html>
第四步:用瀏覽器打開查看內容.
2.HTML的基本結構
<html>
<head></head> <!-- 網頁頭部-->
<body></body> <!-- 網頁的主體-->
</html>
3.HTML的打開方式
第一種:用瀏覽器打開(瀏覽方式) 第二種:用文本編輯器打開(編輯方式)
補充: HTML全稱 Hyper Text Markup Language(超文本標記語言)
4.標題標簽
<title></title> //標題
5.meta標簽
<meta charset="utf-8"/> //設置網頁的字符編碼
<meta name="keywords" content="內容"/>//關鍵詞
<meta name="description" content="內容"/>//網頁描述
6.h標簽
<h1></h1> <h2></h2> <h3></h3> <h4></h4> <h5></h5> <h6></h6>
注意:h標簽只有h1到h6,並且h1最大，依次減小.
慕客網(技術學習)
7.段落標簽 <p></p>
8.換行標簽 <br/>
9.水平線標簽 <hr/>
10.字體樣式標簽 <strong></strong>//加粗 <em></em> //斜體
11.特殊符號
//空格 > //大於符號(>) < //小於符號(<) "// 雙引號(") ©//版權符號 注釋: <!-- 被注釋的內容 -->
用途: 第一種：解釋代碼. 第二種: 當前代碼現在用不到，可能以后用得到.
12.圖片標簽
<img src="圖片地址" alt="當圖片找不到時提示的文字" title="當鼠標放圖片上面時顯示的文字" widht="圖片寬度" height="圖片的高度"/>
13.a標簽(超鏈接)
<a href="跳轉的路徑" target="目標窗口"><a/>
注意:target的常用值:_self(表示當前窗口) _blank(表示新窗口)
1)錨鏈接的使用步驟 第一步:定義錨點 <a name="名字">錨點</a>
第二步:定義鏈接 <a href="#錨點名">鏈接</a>
注意:#可以看出當前頁面 錨點名:表示要跳轉到指定的錨點位置. (就是定義錨點時,name屬性的值.)
2)功能性鏈接 例:<a href="mailto:郵箱地址"></a>
第二章
1.列表
1.1 有序列表 <ol> <li>內容</li> //列表項 </ol>
1.2 無序列表 <ul> <li>內容</li> </ul>
1.3 定義列表 <dl> <dt></dt> //聲明列表項 <dd></dd> //列表項 </dl> 注意:li獨占一行
2.表格
<table> //表格 <tr> //行 <td colspan="" rowspan=""></td> //單元格 </tr> </tabel>
注意: colspan: 表示本單元格所占列數 rowspan: 表示本單元格所占的行數
3.視頻 <video src="視頻路徑" controls></video>
推薦使用:(能夠兼容更多的瀏覽器) <video controls> <source src="xx.mp4" type="video/mp4"/> <source src="xxx.webm" type="video/webm"/> </video>
4.音頻
<audio src="音頻路徑" controls></audio>
推薦使用:(能夠兼容更多瀏覽器) <audio controls> <source src="xx.mp3" type="audio/mp3"/> <source src="xxx.ogg" type="audio/ogg"/> <audio>
注意:a.視頻和音頻標簽都存在瀏覽器的兼容問題，使用的時候，盡量 使用推薦的方式.
b.controls表示顯示播放控制(如:開始，暫停等).還有其他的類似屬性參考其他資料.
5.結構化元素
<header> //表示網頁的頭部
<footer> //表示網頁的尾部
<section> //表示網頁的獨立區域
<article> //表示文章
<aside> //表示相關內容或應用(側邊欄)
<nav> //導航
6.網頁結構
<header></header> //頭部 <section></section> //主體 <footer></footer> // 尾部
7.iframe內聯框架
語法: <iframe src="頁面地址" name=""/> 實現內聯
第一步: 定義iframe <iframe src="" name="mn"/>
第二步: 定義超鏈接並指定超鏈接內容要放置的地方(由target指定). <a href="" target ="mn">xx</a>
第一:實驗本寫兩個(第一章，第三個練習) (第二章, 練習4.視頻播放) 第二:檢查博客.(前面的內容放進去)
第三章 表單
1.語法
<form method="get|post" action="數據向哪提交的地址"> //表單內容 </form>
2.input 標簽常用屬性
<input name="標簽名" type="標簽類型" value="標簽默認值"/>
size:輸入文本框的字符的長度 maxlength:文本框的寬度 checked: 單選框和復選框的默認選中. selected: 下拉框的默認選中
3.常用標簽
text //文本框 checkbox //復選框 password //密碼框 search //搜索框 <select> :下拉框
button //按鈕 radio //單選按鈕 submit //提交按鈕 reset //重置按鈕
url //只能輸入網址 emial //只能輸入郵箱 number //只能輸入數字
其他標簽 file //文件域 range //滑塊 <option></option> 選項 </select> <textarea></textarea> 文本域
注意: radio和checkbox中的name屬性值需要保持一致，才能 到達單選或者多項的作用.
4.表單的高級應用
hidden //隱藏域 readonly // 只讀 disabled // 禁用
5.表單元素的標注
例: <label for="id值"> 男</label> <input type="radio" id="id值"/>
6.表單初級驗證的方法
placeholder //提示 required //必填項 pattern //正則表達式(輸入的內容必須符合這個表達式的要求)