網頁表單表格設計_用表格和表單製作如下網頁完整html代碼

1、關於網頁製作插入表單、表格

用CSS定義一下位置.

2、網頁製作中的表單應該如何設計

1、盡量讓表單一目瞭然
用戶瀏覽網站的時候，通常會快速掃視來獲取信息，看看網站內容和設計是否對他們的胃口或者符合需求，再決定要如何應對、交互。表單也是一樣的道理。一目瞭然的表單能讓用戶立刻知道他們需要填寫多少信息，以及如何提交表單。
更多平面設計知識，請咨詢華南平面設計學校。
2、考慮使用浮動的提示文本
對於是否要在表單的輸入框中加入提示文本有很多爭論，其中主要的爭論圍繞在一點上：當用戶點擊輸入框，游標出現准備輸入的時候，其中的提示文本並沒有自動消失，而需要手動刪除之後再才能輸入。這就非常尷尬了。
3、使用表單格式掩碼
格式掩碼能夠提醒用戶輸入的內容的格式，欄位的長短大小，對於表單的可用性有明顯提升。在用戶激活輸入框的時候，格式掩碼會出現，它會幫助用戶格式化輸入信息，避免提交的時候出錯。格式掩碼常見於數字輸入的時候。
4、把表單設計得易於輸入
你無法確知用戶使用的是手機還是電腦在瀏覽你的網頁，輸入你的表單，但是它應該對於各種輸入設備都足夠友好才行。考慮到你的表單可能會是不同類型的鍵盤輸入的，所以你應該根據表單欄位屬性和檢測到的鍵盤類型，進行適配。
5、選擇垂直單列布局
對於用戶而言，垂直單列的布局比起多列的布局更容易使用。當用戶瀏覽的時候，只需要向下瀏覽即可，不用來回翻看，也可以很好的避免填寫過程中的遺漏。
6、控制輸入內容
盡量使用瀏覽器的記憶功能和Cookie，調用數據將表單中常見的欄位預先填充進去。沒有什麼比打開表單其中的多數欄位已經自動填寫進去，更讓人興奮的了。
7、讓表單短而美
當你設計表單的時候，總想從用戶那兒盡可能多的獲取信息，一定要剋制住這個沖動!
只在表單中呈現重要信息，讓用戶盡可能少的填寫。如果稍後需要提供更多的信息，可以在其他的地方諸如電子郵件中向用戶獲取信息。當用戶已經完成注冊之後，你們後續推送信息、相互溝通、獲取信息的機會更多了。
盡量只保留必要的欄位供用戶填寫，不要提供冗餘的選項，讓表單小而美。

3、用表格和表單設計如下網頁

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>無標題文檔</title>
</head>

<body>
<form action="" method="post" name="form">
<table width="501" border="0" align="center">
<tr>
<td colspan="2" align="center"><h2>請留下個人資料</h2></td>
</tr>
<tr>
<td width="122" align="right">姓名：</td>
<td width="363"><label>
<input type="text" name="textfield" />
</label></td>
</tr>
<tr>
<td align="right">電話：</td>
<td><input type="text" name="textfield2" /></td>
</tr>
<tr>
<td align="right">E-mail：</td>
<td><input type="text" name="textfield3" /></td>
</tr>
<tr>
<td align="right">性別：</td>
<td><label>
<input type="radio" name="radiobutton" value="radiobutton" />
男
<input type="radio" name="radiobutton" value="radiobutton" />
女</label></td>
</tr>
<tr>
<td align="right">年齡：</td>
<td><label>
<select name="select">
<option value="0">-請選擇-</option>
<option value="1">20歲以下</option>
<option value="2">20-30歲</option>
<option value="3">30歲以上</option>
</select>
</label></td>
</tr>
<tr>
<td align="right">留言板：</td>
<td><label>
<textarea name="textarea"></textarea>
</label></td>
</tr>
<tr>
<td align="right">您的愛好</td>
<td><label>
<input type="checkbox" name="checkbox" value="checkbox" />
運動
<input type="checkbox" name="checkbox2" value="checkbox" />
閱讀<br/> <input type="checkbox" name="checkbox2" value="checkbox" />
聽音樂 <input type="checkbox" name="checkbox2" value="checkbox" />
旅遊
</label>

</td>
</tr>
<tr>
<td colspan="2" align="center"><label>
<input type="submit" name="Submit" value="提交" />
</label>
<label>
<input type="reset" name="Submit2" value="全部重寫" />
</label></td>
</tr>
</table>
</form>
</body>
</html>把代碼粘上就是你要的樣子了

4、請問網頁表單怎麼設計比較吸引？

5、網站頁面設計成表格模式

可以用表單大師來實現，表單大師創建的表單可以嵌入網頁的形式。創建表單用現有的欄位進行拖拉就可以設計表單了。操作比較簡單。也可以參考模板。

6、網頁設計中怎樣設計登陸界面，不用css和div.而且要將表格和表單結合起來用

不使用css的可能性不高，因為只要涉及到寬高，背景顏色，這就是css樣式

7、用表格和表單製作如下網頁。完整html代碼

1、使用標簽<table></table>定義網頁的表格,使用style賦值類型將顯示在網頁。

2、使用<tr>標簽定義行,使用<th>定義表頭,表頭的文字自動加粗。

3、<tr>和<td>標簽配合,定義每行中的表格數量,現在定義3行5列的表格。

4、使用<caption></caption>定義表格的標題。

5、表格分為三個部分,表頭部，表主體，表尾部。

6、表頭部和主體分別放標題和表格的內容,而表的尾部通常放的是頁數。

8、做網頁時用表格和表單有什麼區別？？

一、用處不同

1、表格：用於按行列方式展示數據。

2、表單：用於搜集不同類型的用戶輸入。

二、表現方式不同

1、表格：HTML 表格由 table 元素以及一個或多個 tr、th 或 td 元素組成。

2、表單：是一個包含表單元素的區域。表單元素是允許用戶在表單中（比如：文本域、下拉列表、單選框、復選框等等）輸入信息的元素。

三、組成元素不同

1、表格：tr 元素定義表格行，th 元素定義表頭，td 元素定義表格單元。更復雜的 HTML 表格也可能包括 caption、col、colgroup、thead、tfoot 以及 tbody 元素。

2、表單：多數情況下被用到的表單標簽是輸入標簽（<input>）。輸入類型是由類型屬性（type）定義的。

9、網頁端的表單很長怎麼設計排版？

你可以選擇豎著排或橫排，怎樣方便自己怎樣來

10、求設計一個簡單的網頁內容寫一個html頁面，至少包含一個表格、一個表單； 30行以上；美觀不管

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>無標題文檔</title>
<style>
.fontStyle{
color:red;
font-size:18px;
font-weight:bold;
}
</style>
</head>

<body>
<p class="fontStyle">表格</p>
<table cellspacing="0" cellpadding="0" width="500" height="300" border="1">
<tr>
<td>1</td>
<td>2</td>
</tr>
<tr>
<td>2</td>
<td>2</td>
</tr>
<tr>
<td>3</td>
<td>3</td>
</tr>
<tr>
<td>4</td>
<td>4</td>
</tr>
<tr>
<td>5</td>
<td>5</td>
</tr>
<tr>
<td>6</td>
<td>6</td>
</tr>
</table>
<p>----------------------------------------------------------------------------------------------</p>
<form id="form1" name="form1" method="post" action="">
<p class="fontStyle">表單</p>
<p>
<label for="name">姓名：</label>
<input type="text" name="name" id="name" />
</p>
<p>性別：
<input type="radio" name="sex" id="male" value="radio" /><label for="male">男</label>
<input type="radio" name="sex" id="female" value="radio2" /><label for="female">女</label></p>
<p>愛好：
<input type="checkbox" name="music" id="music" /><label for="music">聽音樂</label>
<input type="checkbox" name="web" id="web" /><label for="web">上網</label>
<input type="checkbox" name="book" id="book" /><label for="book">看書</label></p>
<p>
<label for="content">簡歷：</label>
<textarea name="content" id="content" cols="45" rows="5"></textarea>
</p>
</form>
</body>
</html>
把上面的代碼放到dw里，運行就好了，如果還不會，我把網頁傳給你吧！！！

導航:首頁 > 萬維百科 > 網頁表單表格設計

網頁表單表格設計

與網頁表單表格設計相關的知識