HTML body標簽中的相關標簽2
發表時間:2023-09-06 來源:明輝站整理相關軟件相關文章人氣:
[摘要]列表標簽 ul ol dl列表標簽分為三種:無序列表 ul有序列表 ol定義列表 dl無序列表< ul >, 無序列表中的每一項是 < li ><body><ul><li>張三</li><li>李四</li&...
列表標簽 ul ol dl
列表標簽分為三種:
無序列表< ul >, 無序列表中的每一項是 < li >
<body>
<ul>
<li>張三</li>
<li>李四</li>
<li>王五</li>
</ul>
</body>
效果:

注意:
屬性
效果如下:

有序列表< ol >,里面的每一項是< li >
<body>
<ol>
<li>張三</li>
<li>李四</li>
<li>王五</li>
</ol>
</body>
效果:

屬性:
定義列表< dl >
dl 沒有屬性。dl的子元素只能是 dt 和 dd
dt:列表的標題,這個標簽是必須的
dd:列表的列表項,可以不寫
備注:dt,dd只能在dl里面;dl里面只能有dt,dd
<dl>
<dt>第一條規則</dt>
<dd>不準睡覺</dd>
<dd>不準交頭接耳</dd>
<dd>不準下神</dd>
<dt>第二條規則</dt>
<dd>可以泡妞</dd>
<dd>可以找妹子</dd>
<dd>可以看mv</dd>
</dl>
效果:

表格標簽< table >
表格標簽用< table >表示
一個表格<table>
是由每行<tr>
組成的,每行是由<td>
組成的。
所以我們要記住,一個表格是由行組成的(行是由列組成的),而不是由行和列組成的。
<table>
<tr>
<td></td>
<td></td>
<td></td>
</tr>
</table>
< table >屬性
border:邊框。像素為單位
style="border--collapse;collapse;":單元格的線和表格的邊框合并
width:寬度。像素為單位
height:高度。像素為單位
bordercolor:表格邊框的顏色
align:表格的水平方式。屬性值可以填:left right center
注:這里不是設置表格里的內容的對齊方式,如果想要設置內容的對齊方式,要對單元格標簽< td >進行設置
cellpadding:單元格內容到邊的距離。像素為單位。默認情況下,文字是緊挨著左邊那條線的,即默認情況下的值為0
cellspacing:單元格和單元格之間的距離(外邊距)。像素為單位,默認下為0
bgcolor="":表格的背景顏色
background="路徑":背景圖片。背景圖片的優先級大于背景顏色
< tr > 行
一個表格就是一行一行組成的
屬性
dir:公有屬性,設置這一行單元格內容的排列方式。可以取值:ltr:從左到右;rtl:從右到左
bgcolor:設置這一行的單元格的背景顏色
height:一行的高度
align="center":一行的內容水平居中顯示,取值:left,center,right
valign="center":一行的內容垂直居中,取值:top,middle,bottom
< td > 單元格
屬性
單元格的合并
如果要將兩個或多個單元格合并,則就要刪掉其余單元格,只留一個單元格
單元格的屬性:
< caption > 表格的標題。使用時和tr標簽并列
效果:

表單標簽 < form >
表單標簽用< form >表示,用于與服務器的交互。表單就是收集用戶信息的,就是讓用戶填寫的,選擇的
屬性:
name:表單的名稱,用于JS來操作或控制表單時使用
id:表單的名稱,用于JS來操作或控制表單時使用
action:指定表單數據的處理程序,一般是PHP
method:表單數據的提交方式,一般取值:get(默認)和 post
action屬性就是表示,表單將提交到哪里。 method屬性表示用什么HTTP方法提交,有get、post兩種。
get提交和post提交的區別:
GET方式:
將表單數據,以"name=value"形式追加到action指定的處理程序的后面,兩者間用"?"隔開,每一個表單的"name=value"間用"&"號隔開。
特點:只適合提交少量信息,并且不太安全(不要提交敏感數據)、提交的數據類型只限于ASCII字符。
POST方式:
將表單數據直接發送(隱藏)到action指定的處理程序。POST發送的數據不可見。Action指定的處理程序可以獲取到表單數據。
特點:可以提交海量信息,相對來說安全一些,提交的數據格式是多樣的(Word、Excel、rar、img)。
Enctype:
表單數據的編碼方式(加密方式),取值可以是:application/x-www-form-urlencoded、multipart/form-data。Enctype只能在POST方式下使用。
< input > 輸入標簽(文本框)
用于接收用戶輸入
<input type='text' />
屬性:
type="text":文本類型。屬性值可以為:
注:如果要限制上傳文件的類型,需要配合JS來實現驗證,對上傳文件的安全檢查:一是擴展名的檢查,二是文件數據內的檢查
text(默認):文本類型
password:密碼類型
radio:單選按鈕,名字相同的按鈕作為一組進行單選(單選按鈕,天生不能互斥,如果想要互斥,必須要有相同的name屬性)
checkbox:多選按鈕,名字相同的按鈕作為一組進行選擇
checked:將單選按鈕或多選按鈕默認處于選擇狀態。當< input >標簽的type="radio"時,可以用這個屬性,屬性值也是checked
hidden:隱藏框,在表單中包含不希望用戶看見的信息
button:普通按鈕,結合JS代碼進行使用
submit:提交按鈕,傳送當前表單的數據給服務器或者其他程序處理,這個按鈕不需要寫value自動就會有"提交"文字,點擊按鈕后,這個表單就會被提交到form標簽的action屬性中指定的我那個頁面區
reset:重置按鈕,清空當前表單的內容,并設置為最初的默認值
image:圖片按鈕,和提交按鈕的功能完全一致,只不過圖片按鈕可以顯示圖片
file:文件選擇框
value="內容":文本框里的默認內容
size="50":表示文本框可以顯示五十個字符,一個英文或一個中文都算一個字符
注:size屬性值的單位不是像素
readonly:文本框只讀,不能編輯。因為它的屬性值是readonly,所以屬性值可以不寫
disabled:文本框只讀,不能編輯。光標點不進去,屬性值可以不寫
< select > 下拉列表選項
< select >標簽里面的每一項都用< option >表示,select是"選擇",option是
"選項"
< select >屬性:
< option >屬性:
<form>
<select>
<option>小學</option>
<option>初中</option>
<option>高中</option>
<option>大學</option>
<option selected="">研究生</option>
</select>
<br><br><br>
<select size="3">
<option>小學</option>
<option>初中</option>
<option>高中</option>
<option>大學</option>
<option>研究生</option>
</select>
<br><br><br>
<select multiple="">
<option>小學</option>
<option>初中</option>
<option selected="">高中</option>
<option selected="">大學</option>
<option>研究生</option>
</select>
<br><br><br>
</form>
效果:

< textarea > 多行文本輸入框
text是"文本",area是"區域"
屬性:
value:提交給服務器的值
rows="":指定文本區域的行數
cols="":指定文本區域的列數
readonly:只讀
<form>
<textarea name="txtInfo" rows="4" cols="20">路飛學城</textarea>
</form>

以上就是HTML body標簽中的相關標簽2的詳細內容,更多請關注php中文網其它相關文章!
網站建設是一個廣義的術語,涵蓋了許多不同的技能和學科中所使用的生產和維護的網站。