HTML部分：
1.在同一個網頁由當前位置跳轉到指定位置，實現：在指定位置的標籤設定id(或者設定name)，再在當前位置的連結的href屬性設定為”#id”(或者”#name”);如果是跳轉到其他頁面指定位置,則將當前的href屬性設定為”檔名#id”（或者”地址/#id”);

2.如何設定表格表頭不隨瀏覽器滾動條滾動；如何在輸入框前面加入圖示；
如何組合表單元素控制外邊框的長度和高度；如何更新搜尋框的預設值；

3如何設定滑鼠滑動到當前位置，出現下（上）拉選單，左右選單；

4.伺服器/web伺服器/客戶端/服務端
（1）伺服器（server）：管理資源並且為使用者提供服務。
（2）web伺服器：通過網路提供服務；
（3）服務端：是相對於客戶端（Client）軟體而言的，是指能夠開放網路埠，
接收其他的客戶端軟體建立連線，並且通過此連結與客戶端軟體交換資料的軟體，
例如向客戶端提供資源，儲存客戶端資料。
（4）服務端，端是軟體的意思，是提供客戶端功能的管理器許可權；
伺服器，器是機器的意思，或者是與機器相同的環境。
伺服器，是供服務端執行的環境和基礎。
（5）客戶端：與服務端對應，為客戶提供本地服務；除了一些只在本地執行的應用程
序之外，一般安裝在普通的客戶機上，需要與服務端互相配合執行。

5.網路訪問機制
通過（internet）網際網路服務提供商（ISP）連線到網路->在瀏覽器輸入域名或者網址來訪問->計算機連線到域名系統(DNS)的伺服器網路，將域名轉換為IP地址（12位）給計算機->DNS伺服器返回的IP地址能讓瀏覽器連線到託管你所訪問的網路web伺服器->web伺服器將請求的頁面傳送到你的web瀏覽器中。
6.

  （1）<blockquote></blockquote> :標記長的引用的內容
  （2）<q> </q>:標記短的引用內容；建議放在段落p標籤中；
  （3）<cite
 
></cite>:標記引用的作品；
  （4）<address>   </address>：標記一系列地址資訊；
  （5）定義列表：<dl>
                      <dt>詞1</dt>
                         <dd>解釋1</dd>
                      <dt>詞2</dt>
             <dd>解釋2</dd>
                 </dl>
 

  ```

  （6）email連結：<a href="mailto:email地址">     </a>

（7）圖形和圖形說明

     <figure>
        <img src="" alt="" title="">
        <figcaption>
                 影象說明，一般放在p標籤內
         </figcaption>
        </figure>

7.絕對URL/相對URL

8.主頁（index.html）：web伺服器通常會這樣設定，如果未指定檔名會自動回到index.html頁面
9.相簿（www.istockphoto.com;
www.gettyimages.com;
www.veer.com;
www.sxc.hu;
ww.fotolia.com ）
10.圖片屬性 alt:無法檢視圖片時的說明；
title:滑鼠懸停在圖片時的說明；
11.表格
標題：
表頭： 可用屬性scope=”row”/”col”指定是行標題還是列標題
表格要分為三部分：thead,tbody,tfoot;
12.表單如何工作/表單結構
(1)表單控制元件包括：單行文字框（text）;密碼框（password）;文字域（<textarea></textarea>）;按鈕（button,submit,reset,）;圖片按鈕（image）;上傳檔案(file)；單選框（radio）；複選框（checkbox）；單選(多選)下拉列表（<select> </select>(multiple屬性：多選；selected屬性:預設選中；size屬性:顯示的選項數量)）；隱藏控制元件（hidden）:向表單新增使用者不能看到的值（eg:網頁設計人員可以使用一個隱藏欄位來指出使用者在提交表單時位於哪個頁面）；日期控制元件（type=”date”）;電子郵件控制元件（type=”email”）；URL輸入控制元件（type=”url”）；搜尋輸入控制元件
（type=”search”placeholder=”搜尋輸入框的預設值”）；
(2)表單結構：<from action="" method="post" id="">
action屬性：其值是伺服器上一個頁面的URL，這個頁面用來在使用者提交表單時接收表單中的資訊；
method屬性：
（預設）get值（是將表單的內容附加在action所指定URL末尾，適用於：短表單
（eg:搜尋框），只從web伺服器上檢索資料的情形（不傳送那些要在資料庫中新增或
刪除的資料））；
post值(表單中的值被放在HTTP頭資訊中進行傳送，適用於：允許使用者上傳檔案；
非常長；包含敏感資訊（例如密碼等）；向資料庫新增或者刪除資訊)
(3)表單如何工作：
a.使用者填寫表單;
b.單擊按鈕將內容（每一個表單控制元件的名稱和使用者輸入或者選擇的值）
提交 到伺服器;
c.伺服器利用程式語言（Java，C#，php）對資訊進行處理；
d.伺服器給於收到的資訊建立一個新的頁面並將其返回到瀏覽器；

（4）表單中的控制元件
（text,password,textarea,radio,checkbox,select）

當用戶向表單中輸入資訊時，伺服器需要知道每條資料被輸入到
哪個表單控制元件（eg:在登入時，伺服器需要知道哪條資料是作為使用者名稱輸入的，哪條數
據是提供密碼，因此每一個表單控制元件都需要一個name特性，它對應的值對錶單進行標識
並同輸入的資訊一同傳到伺服器）。
（5）檔案（視訊，MP3，PDF）上傳域：如果允許使用者上傳檔案，必須將<form>標籤中的method特性值設為post; <button></button>標籤：允許其他元素出現在<button>元素內（eg:按鈕設定
為圖示+文字形式）標籤表單控制元件<label><label>：用此標籤將其他表格控制元件的文字說明和控制元件
放在一起，提高程式碼的可讀性和簡潔度；
（6）組合表單元素：將一個表單相關的控制元件放在<fieldset>標籤中，組合分類。

<fieldset>
              <legend>Contact details</legend>
    <label>
        age:<input type="text" name="text">
    </label>
        </fieldset>

13.html中id屬性（可用於設定CSS樣式和Javascript對特定元素處理），class屬
（可用於設定CSS樣式）
14.內聯框架<iframe>：用在網頁上分割視窗；其他頁面可以通過這些視窗顯示。
屬性：src(顯示頁面的URL);height;width;scrolling（滾動條,html4）:yes,no,auto;
frameboder(框架邊框html4); seamless(html5,不出現滾動條，無屬性值);
15.頁面資訊<meta>:使用者不可見，用途：把頁面的相關資訊告訴搜尋引擎，指出頁面的設計者，已經頁面是否存在時間敏感性（如果存在，可以設定它的過期時間）。
屬性:
name(屬性):description(用於包含一段有關頁面的描述資訊);keywords(關鍵字列表)；
robots(用於指定搜尋引擎是否可以將這個頁面加入到它們的搜尋結果中，如果不加入content設為：noindex;如果加入但該頁面上鍊接的其他頁面不加入content設為：nofollow)
http-equiv(屬性)：author（網頁設計者）；pragma(no-cache用於防止瀏覽器對頁面的快取（快取是指將頁面儲存到本地，以後訪問該頁面時就可以節省頁面載入時間）);expires(由於瀏覽器經常快取頁面內容，expires選項可以用來指定頁面的過期時間以及快取時間);
content（給name和http-equiv特性的屬性新增屬性值）；
16.向網站中新增視訊的方法：
（1）將視訊上傳到YouTube或Vimeo這樣的站點上，藉助這些站點提供的功能將視訊嵌入到網頁中；優點：不用付費，自動轉換為瀏覽器所支援的格式；缺點：如果想要視訊只在自己的網站中出現（不能在其他網站中觀看），需要在自己的伺服器上提供視訊服務並在頁面中插入自己的播放器，站點會限制內容：例如有廣告的不能上傳，限制視訊質量；
（2）新增flash視訊：a.將視訊轉換為.flv格式；b.找一個可以播放此視訊的flv播放器； c.在網頁中插入播放器；
（3）html5的<video>標籤：並非所有瀏覽器都支援相同的視訊格式（H264：IE，Safari;WebM:Android,Chrome,Firefox,Opera）
的屬性：src(視訊的路徑);poster(在播放前顯示的圖片路徑);width,height；controls(瀏覽器需要提供預設的播放控制元件)autoplay(自動播放);loop(迴圈播放);
preload(告訴瀏覽器在頁面載入時需要做什麼)：none(使用者按下播放按鈕之前，瀏覽器不必載入);auto(頁面載入時載入視訊);metadata(瀏覽器只需收集少量視訊資訊，比如大小，圖片，播放列表和持續時間);

<!DOCTYPE html>
<html>
    <head>
        <title>Adding HTML5 Video</title>
    </head>
    <body>
        <video src="video/puppy.mp4" 
            poster="images/puppy.jpg" 
            width="400" height="300" 
            preload
            controls
            loop>
            <p>A video of a puppy playing in the snow</p>
        </video>
    </body>
</html>

15網頁中新增多個視訊源
可用單標籤<source>來代替<video>中的src屬性
<source>屬性：src(視訊的路徑);type(‘video/mp4’視訊的格式,單引號);codecs(編碼器);

<!DOCTYPE html>
<html>
    <head>
    <title>Multiple Video Sources</title>
    </head>
    <body>
<video poster="images/puppy.jpg" width="400" height="320"                 
 preload controls loop>
    <source src="video/puppy.mp4"type='video/mp4;
    codecs="avc1.42E01E,    mp4a.40.2"' />
    <source src="video/puppy.webm"   
    type='video/webm;codecs="vp8,vorbis"' />
 <p>A video of a puppy playing in the snow</p>
                       </video>
        </body>
</html>

17.向網站中新增音訊的方法：
（1）（託管服務）將音訊上傳到網站（eg:SoundCloud.com/Myspace.com）;
（2）使用flash；
（3）html5的<audio>標籤;
<audio>的屬性：src(音訊的路徑);controls(瀏覽器需要提供預設的播放控制元件)；autoplay(自動播放);loop(迴圈播放);preload(告訴瀏覽器在頁面載入時需要做什麼)：none(使用者按下播放按鈕之前，瀏覽器不必載入);auto(頁面載入時載入視訊);metadata(瀏覽器只需收集少量視訊資訊，比如大小，圖片，播放列表和持續時間);
18網頁中新增多個音訊源
可用單標籤<source>來代替<audio>中的src屬性
<source>屬性：src(視訊的路徑);