技術標籤：web錯誤htmlcsspost

文章目錄

• 區分
• from標籤
• table標籤

區分

• <from>封裝要被提交伺服器的表單內容（一系列控制元件）
  form不管到底嵌套了多少個table標籤;它只關心範圍內有多少個可提交的表單元素。
  主要用於向伺服器傳輸資料；如常見的登入、註冊頁面。

• <table>以表格的形式佈局展示內容
  主要用於建立表格，多與from標籤一起用。

• 即：table僅用來佈局用的，而form則是用來封裝資料的。通常發揮作用的是form，但是form內那些無規則隨意擺放的文字框需要一個form裡巢狀table。

<form action='#'>
<table>
<tr>
<td>使用者名稱：</td>
<td> <input type='text' /> </td>
<tr>
</table>
</form>
 

from標籤

表單能夠包含：文字欄位、複選框、單選框、提交按鈕; input ，menus、textarea、fieldset和 label 元素。。。

<form enctype="multipart/form-data" action="ashx/login.ashx" method="post">
        <!-- 可省為<form method="post"> -->
        <table>
            <tr>
                <td><label for="name">賬號：</label></td>
                <td><input type="text" id="name" name="username"/></td>
            </tr>
            <tr>
                <td><label for="pswd">密碼：</label></td>
                <td><input type="password" id="pswd" name="pswd"/></td>
            </tr>
            <tr>
                <td><input type="reset"/></td>
                <td><input type="submit"/></td>
            </tr>
        </table>
    </form> 
 

from標籤屬性：
1，action ：“一個URL地址”；指定form表單向何處傳送資料
2，enctype ：{string}；規定如何對錶單資料進行編碼。

• application/x-www-form-urlencoded
  在傳送前編碼所有字元（預設為此方式）；
• multipart/form-data
  不進行字元編碼。使用包含檔案上傳控制元件的表單時，必須使用該值
• text/plain

3，method ：{get/post}；指定表單以何種方式傳送到指定的頁面。

• get ：from表單裡所填的值，附加在action指定的URL後面，做為URL連結而傳遞。
• post ：from表單裡所填的值，附加在HTML Headers上。

get 與 post 的區別（具體不同可有上例實驗） 　　
1，資料的查詢：比如瀏覽論壇時，URL一般包含了分類、頁碼數、每頁記錄數等資訊。 get方式，能一目瞭然的看到所要查詢的資訊(條件)。 post 因為隱藏掉了這些資訊，不方便進行檢驗查詢條件。
2，敏感資料的提交(安全性)：對一項記錄，進行更改、新增操作時，比如註冊使用者、更改使用者資料等。get方式附加在URL上，會洩露掉敏感的訊息。post 方式，能隱藏掉敏感的資訊。 　　
3，大資料文字傳遞：get雖然方便查詢，但由於是附加在URL上，各瀏覽器對URL也有個長度限制。IE ：2048字元。Chrome、FF 好像是8182字元。post 好像沒此限制。

table標籤

HTML的table標籤

<table border=0 title="測試">
        <caption> 表格標題</caption>
       <tr><!-- 錶行 -->
            <th>姓名</th><!-- 表頭 -->
            <th>年齡</th>
        </tr>
        <tr>
            <td>張一</td>
            <td>21</td>
        </tr>
        <tr>
            <td><input type=text /></td>
            <td><input type=text /></td>
        </tr>
        <tr>
           <td colspan="2" align="center"><input type=submit /></td>
        </tr>       
    </table>

table標籤 屬性：
border ：定義表格的邊框寬度，預設為0，即無邊框。

• frame(框架)：單線框
  box(框)/above(上)/below(下)/hsides(上下)/vsides(左右)

title ：當滑鼠移到表格上方時，表格的提示資訊。

Cell padding(單元格邊距)：單元格內容與其邊框之間的空白。

<table border="1" cellpadding="10">

Cell spacing(單元格間距)：增加單元格之間的距離。

<table border="1" spacing="10">

th、td標籤屬性：
colspan : 橫向合併單元格
rowspan ：縱向合併單元格

擴充套件屬性：
table，td標籤皆可用；

• bgcolor=“背景顏色”
• background=“背景圖地址”

  <table bgcolor="red">First</table>
  <td background="#">Row</td>

表格的資料分組標籤
<thead><tbody><tfoot>由行組成，分別表示頁首，資料主體，頁尾 ，所以一般包含標籤

如果想要居中對齊可參考：居中方法
為了美觀表格，可參考更多HTML 表格樣式