您的位置:首页 > Web前端 > HTML

html 常用标签

2012-05-18 13:52 246 查看
基本架構
<html>
 <head>
  <title>標題</title>
 </head>
 <body .....>
  網頁內容  
 </body>
</html>

<title></title>
	在瀏覽器的視窗標題欄要顯示的標題文字

<body background=? bgcolor=? text=? link=? vlink=? alink=?>
	background	背景圖形檔的路徑及檔名(用 .gif|.jpg 的圖形檔)
	bgcolor		背景顏色
	text		預設的文字顏色
	link		連結點的顏色
	vlink		已按過的連結點顏色
	alink		連結點被壓下時的顏色

<h1></h1>
	設定文字為標題字,可從 h1....h6 ,每一種的樣式大小均不同

<font size=? color=?></font>
	size		字的大小 1....7
	color		字的顏色

<b></b>			粗體字
<u></u>			底線字
<i></i>			斜體字

<img src="?????" width=? height=? alt="?????" align=?>
<img src="?????" vspace=? hspace=?>
<img src="?????" lowsrc="????">
<img src="?????" usemap="test.htm#testmap>
	src		圖片檔的路徑及檔名(可用 gif|jpg 的圖形檔)
	width		圖片的寬度
	height		圖片的高度
	alt		圖片的替代文字,別人無法看圖時仍可看到這裡設定的文字
	align		圖片和其它圖文的對齊方式可用 left|right|top|texttop|
			middle|absmiddle|baseline|bottom|absbottom
	vspace		圖片周圍水平的空白點數
	hspace		圖片周圍垂直的空白點數
	lowsrc		先顯示低解析度的圖片檔,低解析度的圖片檔路徑及檔名
	usemap		告訴瀏覽器這是一張地圖,地圖的設定參考後面
			test.htm是放地圖設定的檔,testmap是地圖設定的name

<ol type=A|a|I|i|1 start=?>
 <li>???????
 <li>???????
</ol>
	這是會自動加上項目編號的表列文字
	type		設定編號的方式
	start		起啟的號碼

<ul type=square|disc|circle>
 <li>???????
 <li>???????
</ul>

<dl>
 <dt>
  <dd>
  <dd>
</dl>

<center></center>				對中
<div align=right|left|center|justify></div>	臨時變換對齊方式
<p align=right|left></p>			段落
<hr size=? width=?>				分隔線
<pre></pre>					依原有格式顯示
<br>						換行

<a href="??????">連結點文字</a>			連到別的網頁
<a href="#??">連結點文字</a>			連到本頁某段,須配合<a name=?>
<a href="??????#??">連結點文字</a>		連到別的網頁的某段
<a name="??"></a>				定義可連結的段
<a href="http://?????">連結點文字</a>		連到別的網站
<a href="mailto:?????">連結點文字</a>		發信給某人
<a href="ftp://?????">連結點文字</a>		抓檔案
<a href="???" target="_top|????">文字</a>	須配合分割視窗的連結

<table border=? width=? bgcolor=? cellspacing=? cellpadding=?>
 <tr align=? valign=?>
   <td bgcolor=? align=? valign=top|middle|bottom|baseline></td>
   <td colspan=? rowspan=?></td>
 </tr>
</table>
	border		框線粗細
	width		表格的寬度
	bgcolor		背景顏色
	cellspacing	格子間的間距
	cellpadding	邊框和文字的間距
	align		水平的對齊方式
	valign		垂直的對齊方式
	colspan		格子往右延伸的格數
	rowspan		格子往下延伸的格數

<form action="??" method=post|get name="??"></form>
<input type="checkbox" name="??" value="on">?????
<input type="radio" name="??" value="????">?????
<input type="text" name="??">
<input type="password" name="??" value="????">
<input type="hidden" name="??" value="????">
<input type="submit" value="???">
<input type="reset" value="???">

<select name="??" size="??">
 <option value="??" selected>?????
 <option value="??">?????
</secect>

<textarea name="??" cols=? rows=?>???????</textarea>

<META HTTP-EQUIV="Refresh" CONTENT="value;URL=url">

<map name="??">
 <area shape=? coords=? href="????">
</map>
	name		地圖的名稱,<img src="??" usemap="??#name>時用的name
	shape		坐標區的形狀
	coords		坐標
	href		連結點

<frameset rows="?,?"|cols="?,?">
 <frame src="??" name="???" marginwidth=? marginheight=? scrolling=yes|no|auto>
 <frame src="??" name="???" noresize>
</frameset>
	rows		設定垂直的分割方式 rows="30%,*" 上佔30% ,下佔70%
					   rows="100,*" 上佔100點,其它的給下
	cols		設定水平的分割方式 col="10%,*,10%" 左10%,中80%,右10%
	src		分割視窗中顯示的網頁檔案
	marginwidth	窗框邊界的寬度
	marginheight	窗框邊界的厚度
	scrolling	分割視窗是否有捲軸
	noresize	使別人無法改變分割視窗的大小
[例]
左右分割
<frameset cols="20%,*">
 <frame src=menu.htm name=left scrolling=auto>
 <frame src=welcome.htm name=right noresize>
</frameset>

上下分割
<frameset rows="20%,*">
 <frame src=menu.htm name=left scrolling=auto>
 <frame src=welcome.htm name=right noresize>
</frameset>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: