HTML(标簽）

HTML标簽分類

1.塊級标簽 ：每個塊級标簽獨自占一行

h1--h6 标題

p  段落

hr ： 水準線

ol li  有序清單

ul li : 無序清單

div : 

2.行級标簽  : 按行逐一顯示，不會自動換行

img ,a,b,i,em,strong,small,br,span

img 圖檔

src:圖檔位址

alt:提示文字

a：超連結  屬性 href : 要連接配接到的位址

target : '_blank','_self'

b:給文字加粗

i:斜體

em:強調字型，效果跟斜體一樣

strong : 強調字型，效果和粗體一樣

small : 小号字型

br : 換行

span : 普通的行級标簽，沒有任何效果

特殊符号 ：需要進行轉義

< :  &lt;  （less than）

> : &gt;  (great than)

"" : &quot;

空格：&nbsp;

版權号：&copy;

<img src="img/goodsDetails11.jpg"  alt="圖檔"/>
		<a href="http://www.baidu.com" target="_blank">百度</a>
		<b>加粗文字</b>
		<i>斜體文字</i>
		<b><i>加粗斜體文字</i></b> <br />
		<strong>強調文字</strong><br />
		<small>2小号文字</small>外部文字<br />
		H<small>2</small>O<br />
		<em>強調效果和斜體一樣</em><br />
		<span>
			這是一個
			     
			     
			span标簽，沒有任何樣式
			小于号是：< <br />
			大于号是： >
			雙引号是："
			版權号是：&copy;
		</span>           

表格

table : 表格

tr : 行

th : 定義表格的頁眉單元格

td :定義普通單元格

colspan:誇列

rowspan : 跨行

thead:表格頭部資訊

tbody:表格主體部分

tfoot:表格腳

caption: 表格标題

rowspan:合并行  colspan:行并列

<h4>表頭：</h4>
    <table border="1">
    <thead>
  <th>姓名</th>   
  <th>電話</th>
  <th>電話</th>
    </thead>
    <tr>
  <td rowspan="2">Bill Gates</td>
  <td>555 77 854</td>
  <td>555 77 854</td>
  </tr>
  <tr>
   <td>Bill Gates</td>
   <td colspan="2">555 77 854</td>
  </tr>
   <tfoot>
   	<td rowspan="3">Bill Gates</td>
   <td colspan="2">555 77 854</td>
  </tfoot>
</table>

  <h4>垂直的表頭：</h4>
  <table border="1">
  <thead>
  <th>姓名</th>
  <td>Bill Gates</td>
  </thead>
  <tr>
  <th>電話</th>
  <td>555 77 854</td>
 </tr>
 <tr>
  <th>電話</th>
  <td>555 77 855</td>
</tr>
</table>           

表單

form 

屬性

action : 要處理該表單的url位址（送出到的服務端位址）

method : 請求的方式 

1：post,在位址欄不顯示表單資料；

2：get:表單資料在位址欄顯示

                         name：辨別     autocomplete:浏覽器是否可以自動填充

                         enctype:指定表單内容編碼 （預設 utf-8）

input

屬性：

type:

text : 文本輸入框

password : 密碼輸入框

radio : 單選框

checkbox : 複選框

button :按鈕

name : 表單元素的名字   

value : 表單的值     

checked : 是否選中，隻能用于 radio 和checkbox

disabled : 設定表單元素不可用

                       【在form表單中如果屬性的值和屬性名相同，可以省略屬性值如checked和disabled】

maxlength : 最大字元數

<form action="http://www.baidu.com" method="get">
	使用者名：<input type="text" name="username" value="123456" /><br />
	密碼：<input type="password" name="password" value="123456"/><br />
	确認密碼：<input type="password" name="repassword" value="123456" /><br />
	性别：男 <input type="radio" name="sex" value="nan" />
	女 <input type="radio" name="sex" value="nv" /><br />
	愛好：<input type="checkbox" name="love" value="1" />吃
	<input type="checkbox" name="love" value="2" />喝
	<input type="checkbox" name="love" value="3" />玩
	<input type="checkbox" name="love" value="4" />樂 <br />
	
	<hr />
<textarea rows="10" cols="30">
這是一個文本域
</textarea>
<hr />
下拉菜單
<select name="愛好">
<option value="chi" value="1">吃</option>
<option value="he" value="2">喝</option>
<option value="wan" value="3" selected="selected">玩</option>
<option value="le" value="4">樂</option>
</select>
<hr />
  <fieldset>
    <legend>健康資訊</legend>
    身高：<input type="text" />
    體重：<input type="text" />
  </fieldset>
  <button>button送出</button>
  <input type="button" value="input_button 送出"/>
  <input type="submit" value="input_submit 送出" />
</form>           

點選input_button不會送出，點選button 送出 和 input_submit 送出 可以送出，位址欄結果如下：

（www.baidu.com 隻是示例，沒有實際用途）