文章目錄
HTML5基礎
（1）表格
在這裏插入代碼片
<table> 定義表格
<tr>定義表格中的行 table row
<td> 定義表格中的單元格
<thead> 定義表頭的單元格
<tfoot>定義表注
<tbody>定義表格中主題內容
<html>
<head>
<title><font size="20",color="red">想了解這個世界，hello world</font></title>
</head>
<body>
<table border="1">
<tr><th>編號</th><th>名稱</th></tr>
<tr><td>01</td><td>藍色</td></tr>
<tr><td>02</td><td>綠色</td></tr>
<tr><td>03</td><td>米色</td></tr>
</table>
</body>
</html>
（2）表單
<form action=*"**跳轉頁面**"* method=*"**get"*|"post" name=*"**表單名稱**"* target=*"**打開方式**"* enctype=*"multipart/form-data"*>
表單數據項部分
- action屬性是提交表單後跳轉的目標頁面。
- method屬性取值get或post，默認爲get。get和post的主要區別在於使用get方式提交的信息會在提交的過程中顯示到瀏覽器的地址欄；而以post方式提交的信息則不會顯示到地址欄。
- target屬性指定打開目標頁面的方式，其值可以爲_blank、_parent等。
- enctype屬性主要用於表單具有上傳功能時使用該屬性，且該屬性的值爲“multipart/form-data”，該屬性爲可選屬性。
- 位於與之間的輸入域可以是文本域、下拉列表、單選框、複選框等。
<!DOCTYPE html>
<html>
<head>
<title>know the world</title>
</head>
<body>
<form>
請輸入您的學號：<br>
<input type="text" name="xuahao">
<br>
請輸入您的姓名：<br>
<input type="text" name="name">
</form>
</body>
</html>
（3）輸入域標籤
在表單中使用輸入域標籤（）來指定表單中數據的輸入方式以及表單的提交按鈕。
輸入標籤的type屬性用於指定輸入方式，
name屬性指定此輸入標籤的名稱，其語法格式如下。
<input type=“類型” name=“輸入項名稱” value=“輸入項值” />
| 類型 | 描述 |
|---|---|
| text | 定義常規文本輸入。 |
| radio | 定義單選按鈕輸入（選擇多個選擇之一） |
| submit | 定義提交按鈕（提交表單） |
其中type取值可以爲：
¡text：表示爲單行文本框；
¡radio：表示爲單選框，還可以使用checked屬性等；
¡hidden：表示輸入界面不可見，表單直接將中value屬性的值提交給服務器。
¡password：密碼輸入框，輸入時以“*”回顯；
¡file：文件上傳，type若是file時，標籤還要設置enctype的屬性值爲multipart/form-data；
¡checkbox：表示爲複選框，支持多選；
¡email：HTML5新增，表示E-Mail地址的輸入域，提交表單時進行E-Mail合法性校驗；
¡url：HTML5新增，表示URL的輸入域，提交表單時進行URL合法性校驗；
¡number：HTML5新增，表示數值的輸入域，可以通過min和max屬性設定數值的接受範圍；
¡range：HTML5新增，表示一定範圍內數字值的輸入域，外觀顯示爲滑動條，可以通過min和max屬性設定數值的接受範圍；
¡Date pickers (date, month, week, time, datetime, datetime-local)：HTML5新增，其中input的屬性值可以爲括號中其中任意一個，表示日期或時間輸入域；
¡search：HTML5新增，搜索域，比如站點搜索或 Google 搜索
¡submit：提交按鈕，單擊提交按鈕後，服務器就可以獲取表單提交的各個數據項；
¡reset：重置鍵按鈕，將清空表單中的各數據項。
（4）下拉列表框
在表單中可以使用下拉列表來選擇要提交的數據，下拉列表框使用標籤，而下拉列表框中的選項使用標籤表示。
<select name=“sel”>
<option value="value1">選項1</option>
<option value="value2">選項2</option>
...
</select>
語法格式爲：
（5）多行文本框
文本域標籤可以輸入多行文本，表單中使用<>如下
<textarea rows=*"**行數**"* cols=*"**列數**"* name=*"**名稱**"*>文本內容</textarea>
（6）塊標籤
<div>標籤可以把文檔分割爲獨立的、不同的部分。它可以用作嚴格的組織工具，並且不使用任何格式與其關聯。
<div position=absolute|relative visibility=visible|hidden|inherit top="象素" right="象素" bottom="象素" left="象素" margin="象素" height="象素" width="象素" >
文本塊
<div>
CSS樣式表的定義
CSS樣式表是針對指定對象進行樣式修飾的，CSS由3個基本部分組成：對象、屬性和屬性值。在這個3個組成部分中，對象是最重要的，它指定了對哪些網頁元素進行設置，因此有一個專門名稱——選擇器（Selector）來指定對象。定義選擇器的語法格式如下：
selector{
屬性1：屬性1值;
屬性2：屬性2值;
……
}
CSS樣式表的引用
CSS提供了四種在HTML頁面中插入CSS樣式表的方法：
- 鏈接外部樣式表
- 導入外部樣式表`
- 內部樣式表
- 內嵌樣式`
1 外部樣式表 link
當同一種的樣式需要應用於很多頁面，外部樣式表是理想的選擇
<head>
<link rel="stylesheet" type="text/css" href="style.css" />
</head>
2 內部樣式表 style
內部樣式表是把樣式表放到頁面的區域內，這些定義的樣式只能應用到該頁面中，內部樣式表使用
<style>
p{margin-left:10px;}
body{ background-image:url("images/bg1.png");}
……
</style>
3導入樣式表 style內部加@import
導入外部樣式表是指在內部樣式表的
style>
@import "外部樣式表.css";
</style>
4內聯樣式
內聯樣式由於要將表現和內容混雜在一起，內聯樣式會損失掉樣式表的許多優勢。請慎用這種方法，當樣式僅需要在一個元素上應用一次時，一般選用此方式。下面是一個在頁面中針對某個
標籤單獨設置CSS樣式的例子。
<p style="margin-left:20px; color:red">This is a paragraph. </p>
