img元素

img元素 (image)，為「線內」元素，插入畫像至指定位置上。利用src屬性指定畫像的URI。有時會有無法顯示畫像的時候，因此必須使用alt屬性定義其替代文字。

語法:
<img屬性 = "屬性值" />
版本:
HTML4.01(S,T,F) XHTML1.0(S,T,F) XHTML1.1 *1)
內含元素:
-
屬性:
align、alt、border、height、hspace、ismap、longdesc、name、src、usemap、vspace、width屬性*2)、事件屬性、通用屬性(class、dir、id、style、title、lang、xml:lang)
Sample Code
<p>
<img  id = "logo" alt="CHOU-IT" src="/images/mark_chou-IT.jpg"
style="vertical-align:top;margin-right:3px;border:0px;"/>
綜合情報網
</p>
Output

CHOU-IT綜合情報網

*1)S → Strict DTD ，T → Transitional DTD，F → Frameset DTD。 *2)刪除線 → W3C非推薦屬性，建議是用CSS取代 ，粗體字 → 必要屬性，不可省略。
屬性 適用元素 屬性值 說明
align img left
right
top
middle
bottom 		設定圖像的位置以及和之後的文字的對齊方式。align為非推薦元素，建議使用CSS的float、margin屬性取代。
left → 圖像靠左，Text在圖像右邊。
right → 圖像靠右，Text在圖像左邊。
top → 1行文字和圖像上方對齊。
middle → 1行文字和圖像垂直中央對齊。
bottom → 1行文字和圖像下方對齊。
alt img 替代文字列(altanative text) 必須屬性，設定網頁發生問題無法顯示圖像時的替代文字列(altanative text)。
border img 整數(pixels) 設定圖像的框線。初期值為"0"，沒有框線，但是有些UA環境在設定圖像連結後，會出現框線，只要將border屬性設定為"0"，框線就會消失。
height img 整數(pixels)、百分比(%) 設定圖像的高度。能夠設定和實際圖像大小不同，但因圖像解析度不同的關係會失真。事先有設定圖像大小，在開起網頁時，會先確保圖像的領域，等讀取其他元素後再顯示圖像，處理速度較快。
hspace img 整數(pixels) 設定圖像的左右邊界空白。
W3C非推薦元素，建議使用CSS的margin屬性取代。
ismap img ismap 有使用到CGI程式的image map的情形才設定。點選連結圖像候，圖像中的座標值(X,Y)會傳送給CGI程式。
例)ismap ="ismap"
longdesc img URI 設定圖像補充說明文件的URI。
例)longdesc = "image_descript.html"
name img 文字列 設定圖像名稱。XHTML1.1會廢止，由id取代。
src img URI 必須屬性，設定圖像所在URI。
例)src= "images/img.jpg"
usemap img image map名稱 設定和map元素作成的image map的關聯。image map名稱前須加hash(#)，利用usemap = "#名稱"形式指定map元素的id值或name值。
例)usemap = "#map"
vspace img 整數(pixels) 設定圖像的上下邊界空白。
W3C非推薦元素，建議使用CSS的margin屬性取代。
width img 整數(pixels)、百分比(%) 設定圖像的寬度。能夠設定和實際圖像大小不同，但因圖像解析度不同的關係會失真。事先有設定圖像大小，在開起網頁時，會先確保圖像的領域，等讀取其他元素後再顯示圖像，處理速度較快。

applet元素

applet元素 (applet)，為「線內」(「區塊」)元素，設定網頁內崁入java applet。java applet為java語言所開發出的程式，一般使用於呈現網頁上的動畫和遊戲。

語法:
<applet屬性 = "屬性值"> 標籤內容~ </applet>
版本:
HTML4.01(T,F)、XHTML1.0(T,F) *1)
內含元素:
param元素、「區塊」)元素、「線內」元素、Text
屬性:
align、alt、archive、code、codebase、height、hspace、name、object、vspace、width屬性*2)、通用屬性(class、id、style、title)
Sample Code
<applet code="Happy.class" width="40%" height="40%" codebase="applet/">
<param name="IMG" value="cityback.jpg"/><!-- background image -->
...
</applet>
Output
You need browser equipping Java.

java applet程式取自Amusing Java Applets(open source)

*1)S → Strict DTD ，T → Transitional DTD，F → Frameset DTD。 *2)刪除線 → W3C非推薦屬性，applet本身也是W3C非推薦元素，建議是用Object元素取代，但是IE6.0未對應使用object崁入applet，因此還是不能不使用。
屬性 適用元素 屬性值 說明
align applet left
right
top
middle
bottom 		設定applet的位置以及和之後的文字的對齊方式。align為非推薦元素，建議使用CSS的float、margin屬性取代。
left → applet靠左，Text在圖像右邊。
right → applet靠右，Text在圖像左邊。
top → 1行文字和applet上方對齊。
middle → 1行文字和applet垂直中央對齊。
bottom → 1行文字和applet下方對齊。
alt applet 替代文字列(altanative text) 必須屬性，設定網頁發生問題無法顯示applet時的替代文字列(altanative text)。
archive applet URI 設定java applet的archive檔(*.jar)的所在位置URI。archive檔為複數個applet的壓縮檔。UA事前讀入applet檔，可以提升applet的效率。
code applet URI 設定java applet的class(*.class)檔的所在位置URI。
codebase applet URI路徑 設定java applet的基礎URI路徑。有設定時，archive、code屬性必須設定為其相對URI。
<applet code="Happy.class" width="30%" height="30%" codebase="applet/Hanabi/">
height applet 整數(pixels)、百分比(%) 必須屬性，設定applet的高度。
hspace applet 整數(pixels) 設定applet的左右邊界空白。
W3C非推薦元素，建議使用CSS的margin屬性取代。
name applet 文字列 設定applet名稱。大小寫有區別，須注意。
object applet URI 保存applet狀態資料的URI。code屬性沒有設定的話，就必須設定(兩者擇一)。但是window的IE6、7、Macintosh的IE5沒有對應，code屬性。
vspace applet 整數(pixels) 設定applet 的上下邊界空白。
W3C非推薦元素，建議使用CSS的margin屬性取代。
width applet 整數(pixels)、百分比(%) 必須屬性，設定applet 像的寬度。

object元素

object元素 (object)，為「線內」(「區塊」)元素，崁入java applet、畫像、聲音、動畫等物件至指定位置上。但是，現狀瀏覽器對應object不十分完整，畫像配合img元素使用，java applet配合applet元素使用，聲音、動畫配合embed元素使用。

語法:
<applet屬性 = "屬性值"> 標籤內容~ </applet>
版本:
HTML4.01(S,T,F) XHTML1.0(S,T,F) XHTML1.1 *1)
內含元素:
param元素、「區塊」)元素、「線內」元素、Text
屬性:
align、archive、border、classid、codebase、codetype、data、declare、height、hspace、name、standby、type、usemap、vspace、width、屬性*2)、事件屬性、通用屬性(class、dir、id、style、title、lang、xml:lang)
Sample Code
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" 
codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/
swflash.cab#version=6,0,0,0" width="150" height="50" id="time1" > 

		
<param name="movie" value="time1.swf" />

		
<param name="quality "value="high"/>

		
<param name="bgcolor "value="#FFFFFF"/>

		
<embed src="time1.swf" quality=High width="150" height="50" name="time1" 

		
type="application/x-shockwave-flash" 

		
pluginspage="http://www.macromedia.com/go/getflashplayer"></embed>

		
</object>

	

	

		
Output

		
		
		
		
		
		
		
flash程式取自tomisan的flash素材

	

	*1)S → Strict DTD ，T → Transitional DTD，F  → Frameset DTD。
	*2)刪除線 → W3C非推薦屬性，建議是用CSS取代。
	

	

	

		屬性
		適用元素
		屬性值
		說明
	

	

		align
		object 
		left
right
top
middle
bottom  		
		設定object 的位置以及和之後的文字的對齊方式。align為非推薦元素，建議使用CSS的float、margin屬性取代。
left → 
		applet靠左，Text在圖像右邊。
right → applet靠右，Text在圖像左邊。
top → 1行文字和applet上方對齊。
middle → 1行文字和applet垂直中央對齊。
bottom → 1行文字和applet下方對齊。		
	

	

		archive
		object 
		URI
		設定object的archive檔的所在位置URI。archive檔為複數個object的壓縮檔。UA事前讀入object檔，可以提升object的效率。複數指定時，使用半形空白區隔。
例)object為java applet時，archive = "1.jar 2.jar"		
	

	

		border
		object 
		整數(pixels)
		設定object 的框線。W3C非推薦元素，建議使用CSS的border屬性取代。
	

	

		classid
		object 
		URI
		設定Active控制元件的Class ID，object為java applet時，設定Class file(*.jar)。Active控制元件window IE的專有的plugin，classid只在window IE上有效，典型的classid有下列幾種:
		
˙Flash Player的識別碼
 → classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
˙Windows Media Player的識別碼
 → classid="clsid:6BF52A52-394A-11d3-B153-00C04F79FAA6"
˙RealPlayer的識別碼
 → classid="clsid:CFCDAA03-8BE4-11CF-B84B-0020AFBBCCFA"

		˙Shockwave的識別碼
 → classid="clsid:clsid:166B1BCA-3F9C-11CF-8075-444553540000"		
	

	

		codebase
		object 
		URI路徑
		設定object的基礎URI路徑。有設定時，archive、code屬性必須設定為其相對URI。在網路下載object時，會連同對方的codebase設定也一起下載，不做修改的話會有無法正常動作的情形。
	

	

		codetype
		object 
		MIME Ttpe
		設定classid屬性所指定object的MIME Ttpe。UA在執行之前，可以事先判斷目前環境下是否可以執行。建議有設定classid屬性時，請也設定codetype屬性。
	

	

		data
		object 
		URI
		設定object的所在URI位置。可以和classid並用或替代。
	

	

		declare
		object 
		declare
		設定object 為待機狀態，只宣告不會執行。
例)declare = "declare"		
	

	

		height
		object 
		整數(pixels)、百分比(%)
		設定object的高度。
	

	

		hspace
		object 
		整數(pixels)
		設定object 的左右邊界空白。
W3C非推薦元素，建議使用CSS的margin屬性取代。		
	

	

		name
		object 
		文字列
		設定applet名稱。大小寫無區別。
	

	

		standby
		object 
		Text
		設定在下載object時，等待期間所顯示的文字列。目前UA環境幾乎沒有對應。
	

	

		type
		object 
		MIME Type
		設定data屬性所指定object的MIME Ttpe。UA在執行之前，可以事先根據MIME Ttpe判斷目前環境下是否可以執行。
	

	

		usemap
		object 
		image map名稱
		設定和map元素作成的image map的關聯。image map名稱前須加hash(#)，利用usemap = "#名稱"形式指定map元素的id值或name值。
例)usemap = "#map"		
	

	

		vspace
		object 
		整數(pixels)
		設定object的上下邊界空白。
W3C非推薦元素，建議使用CSS的margin屬性取代。		
	

	

		width
		object 
		整數(pixels)、百分比(%)
		必須屬性，設定applet 像的寬度。
	

	







	





	
param元素  

	
param元素 (named property value)，為applet元素、object元素的子元素，設定啟動java applet、object時所需的參數值。

	

		
語法:

		
<applet屬性 = "屬性值"> 標籤內容~ </applet>

		
版本:

		
HTML4.01(S,T,F) XHTML1.0(S,T,F) XHTML1.1 *1)

		
內含元素:

		
 -

		
屬性:

		
name、type、value、valuetype屬性*2)、通用屬性(id)

	

	

		
Sample Code

		
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" 

		
codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/

		
swflash.cab#version=6,0,0,0" width="150" height="50" id="time1" > 

		

		
<param name="movie" value="time1.swf" />

		
<param name="quality "value="high"/>

		
<param name="bgcolor "value="#FFFFFF"/>

		
<embed src="time1.swf" quality=High width="150" height="50" name="time1" 

		
type="application/x-shockwave-flash" 

		
pluginspage="http://www.macromedia.com/go/getflashplayer"></embed>

		
</object>

	

	

		
Output

		
		
		
		
		
		
		
flash程式取自tomisan的flash素材

	

	*1)S → Strict DTD ，T → Transitional DTD，F  → Frameset DTD。
	*2)刪除線 → W3C非推薦屬性，建議使用CSS取代。粗體字 → 必要屬性，不可省略。
	

	

	

		屬性
		適用元素
		屬性值
		說明
	

	

		name
		param 
		文字列 
		設定執行java applet、object的變數名稱。何種變數名稱可以設定，請參考java applet、object的操作手冊。name屬性所指定的變數名稱和value所指定的變數值，會被代入處理。
	

	

		type
		param 
		MIME Type
		valuetype的屬性值為"ref"時有效。設定value屬性所指定object的MIME Ttpe。UA在執行之前，可以事先根據MIME Ttpe判斷目前環境下是否可以執行。
	

	

		value
		param 
		文字列
		設定變數名稱的值。
	

	

		valuetype
		param 
		data
object
ref 		
		設定變數值的型態。初期值為"data"
data → 資料文字列，object → Object元素的ID名，
ref →  執行所需資料的URI位置(type屬性指定資料的MIME Type)		
	

	



	





	
embed元素  

	
embed元素 (embed)，為Netscape Navigator 2.0獨自採用的功能，崁入動畫、聲音等至網頁中。現在Netscape之外，含有IE、Firefox、Opera、Safari也有對應。

	

		
語法:

		
<embed 屬性 = "屬性值"> 標籤內容~ </embed>

		
版本:

		
不明

		
內含元素:

		
 -

		
屬性:

		
align、autostart、height、hidden、loop、name、pluginspage、src、width屬性*2)、通用屬性(class、dir、id、lang、style、tile)

	

	

		
Sample Code

		
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" 

		
codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/

		
swflash.cab#version=6,0,0,0" width="150" height="50" id="time1" > 

		

		
<param name="movie" value="time1.swf" />

		
<param name="quality "value="high"/>

		
<param name="bgcolor "value="#FFFFFF"/>

		
<embed src="time1.swf" quality=High width="150" height="50" name="time1" 

		
type="application/x-shockwave-flash" 

		
pluginspage="http://www.macromedia.com/go/getflashplayer"></embed>

		
</object>

	

	

		
Output

		
		
		
		
		
		
		
flash程式取自tomisan的flash素材

	

	*1)S → Strict DTD ，T → Transitional DTD，F  → Frameset DTD。
	*2)刪除線 → W3C非推薦屬性，建議使用CSS取代。粗體字 → 必要屬性，不可省略。
	

	

	

		屬性
		適用元素
		屬性值
		說明
	

	

		align
		embed 
		left
right
top
middle
bottom  		
		設定Plugin資料的位置以及和之後的文字的對齊方式。align為非推薦元素，建議使用CSS的float、margin屬性取代。
		
left →  Plugin資料靠左，Text在圖像右邊。
right → Plugin資料靠右，Text在圖像左邊。
top → 1行文字和Plugin資料上方對齊。
middle → 1行文字和Plugin資料垂直中央對齊。
bottom → 1行文字和Plugin資料下方對齊。		
	

	

		autostart
		embed 
		true
false 		
		設定Plugin資料讀入後，是否自動再生。
true → 自動再生 
false →  手動再生  		
	

	

		height
		embed 
		整數(pixels)
		設定Plugin資料的高度。
	

	

		hidden
		embed 
		true
false		
		設定Plugin資料是否要顯示。
true →  隱藏
false →  顯示  		
	

	

		loop
		embed 
		true
false		
		設定Plugin資料是否要輪播。
true →  輪播
false →  只1次  		
	

	

		name
		embed 
		文字列
		設定Plugin資料的名稱。  
	

	

		pluginspage
		embed 
		URI
		UA環境所需Plugin資料尚未安裝時， 提示可以取得位置URI。
例)播放Flash的Plugin資料

		pluginspage="http://fpdownload.macromedia.com/pub/
shockwave/cabs/flash/swflash.cab#version=9,0,0,0"		
	

	

		src
		embed 
		URI
		設定Plugin資料的所在位置URI。  
	

	

		width
		embed 
		整數(pixels)
		設定Plugin資料的寬度。  
	

	



	





	
bgsound元素  

	
bgsound元素 (background sound)，為IE 2.0獨自採用的功能，設定背景音樂(BGM)。打開網頁會自動播放音樂，會造成使用者的困擾，不建議使用。

	

		
語法:

		
<bgsound 屬性 = "屬性值"  />

		
版本:

		
不明

		
內含元素:

		
 -

		
屬性:

		
balance、loop、src、volume*2)、通用屬性(id)

	

	

		
Sample Code

		
<bgsound src ="xxxx.mid" loop = "-1"/><--!無限次播放-->

	

	*1)S → Strict DTD ，T → Transitional DTD，F  → Frameset DTD。
	*2)刪除線 → W3C非推薦屬性，建議使用CSS取代。粗體字 → 必要屬性，不可省略。
	

	

	

		屬性
		適用元素
		屬性值
		說明
	

	

		balance
		bgsound 
		-10000 ~ 10000
		設定背景音樂的音量。值為"-10000"時，只有左側喇叭。值為"10000"時，只有右側喇叭。
	

	

		loop
		bgsound 
		整數
infinite 		
		設定背景音樂的播放次數。值為"-1"或為"infinite"時，無限播放。
	

	

		src
		bgsound 
		URI 
		設定背景音樂檔的所在位置URI。
	

	

		volume
		bgsound 
		-10000 ~ 0的整數 
		設定背景音樂的音量。值為"-10000"時，音量最小。值為"0"時，音量最大。
	

	



	












Copyright(C)2009超技情報開發研究室 All rights reserved.