Web前端——Html常用標簽及屬性

html

常用的標題等標簽就不記錄了，只記錄一下比較少見的標簽以及屬性

表格 table

• td 單元格
• tr 表的行
• th 表頭

td或th可以下面的兩個屬性達到跨行或跨列

• 表格跨行 rowspan
• 表格跨列 colspan

例子：

<!--cellspacing 單元格間距 cellpadding單元格邊距  -->
<table border="1" cellspacing="0" cellpadding="0">
	<tr><th colspan="2">Header</th></tr>
	<tr><td>Data</td><td>Data</td></tr>
</table>

效果：

Header
Data	Data

跑馬燈 marquee標簽

marquee標簽 跑馬燈效果

• scrolldelay 移動速度
• direction 移動方向 有上下左右 up down left right
• behavior 滾動方式 scroll:循環滾動，默認效果； slide:只滾動一次就停止； alternate:來回交替進行滾動
• scrollamount 移動速度 每次移動的距離像素
• scrolldelay 滾動延遲 設置滾動的時間間隔，單位是毫秒

代碼：

<marquee>
	<p>hello world!this is marquee!</p>
</marquee>

效果：

hello world!this is marquee!

marquee參考鏈接

表單 form

代碼:

<!-- 文字和輸入框居中對齊 -->
<label fro="username">用戶名<input id="username" type="text">

效果：
用戶名:

表單元素：

• input 單行輸入框，根據不同的 type 屬性，可以變化為多種形態
  不同type的樣式參考鏈接
• select 下拉選擇
• textarea 多行輸入框
• button 按鈕

常用屬性：

• required 該標簽內容必須填寫
• minlength 輸入最短長度
• maxlength 輸入最長長度
• readonly 只讀，無法點擊，可以復制
• disable 禁用，背景色變灰色，無法點擊，無法復制

使用了minlength或maxlength鼠標懸浮在輸入框上面會出現提示

這個最小長度為4，最大長度為6
這個是郵箱輸入框

• get: 明文顯示，書簽收藏，提交數據量有限制
• post: 密文顯示，文件上傳需求

如果要做文件上傳表單數據的編碼方式必須是：multipart/form-data
    <form method="post" enctype="multipart/form-data">;
	//例如：
	<form action="servlet/upload" method="post" enctype="multipart/form-data">
	    <br><br>
	    文件(file): <input type="file" name="upload">
	    <br>
	    <br>
	    <button type="submit">上傳</button>
	
	    <br><br>
	    ajax：異步請求
	</form>

html表單參考鏈接

框架 frameset

frameset屬性：

• rows 分為幾行
• rows="20%,80%" rows="20%,*"
• cols 分為幾列

frame屬性：

• scrolling 滾動條是否顯示 no，1（yes)
• src 對應的html頁面定義

frame設置name.a標簽指定target為該frame的name，就會在該處frame打開新頁面