JSF - h:graphicImage

h:graphicImage 標籤渲染一個型別為“img”的 HTML 元素。

JSF 標籤

<h:graphicImage  
   value = "https://tutorialspoint.tw/images/jsf-mini-logo.png"/>

渲染輸出

<img src = "https://tutorialspoint.tw/images/jsf-mini-logo.png" />

標籤屬性

序號	屬性和描述
1	id 元件的識別符號
2	binding 對可以在支援 Bean 中使用的元件的引用
3	rendered 布林值；false 抑制渲染
4	styleClass 層疊樣式表 (CSS) 類名
5	value 元件的值，通常是值繫結
6	alt 非文字元素（如影像或小程式）的替代文字
7	dir 文字方向。有效值為ltr（從左到右）和rtl（從右到左）
8	lang 元素屬性和文字的基本語言
9	style 內聯樣式資訊
10	tabindex 指定選項卡索引的數值
11	target 在其中開啟文件的框架的名稱
12	title 一個標題，用於輔助功能，描述一個元素。可視瀏覽器通常為標題的值建立工具提示
13	usemap 元素的 usemap
14	url 影像的 URL
15	width 元素的寬度
16	onblur 元素失去焦點
17	onchange 元素的值發生變化
18	onclick 滑鼠按鈕在元素上單擊
19	ondblclick 滑鼠按鈕在元素上雙擊
20	onfocus 元素獲得焦點
21	onkeydown 按鍵按下
22	onkeypress 按鍵按下並隨後釋放
23	onkeyup 按鍵釋放
24	onmousedown 滑鼠按鈕在元素上按下
25	onmousemove 滑鼠在元素上移動
26	onmouseout 滑鼠離開元素區域
27	onmouseover 滑鼠移動到元素上
28	onmouseup 滑鼠按鈕釋放

示例應用程式

讓我們建立一個測試 JSF 應用程式來測試上述標籤。

步驟	描述
1	在包com.tutorialspoint.test下建立一個名為helloworld的專案，如JSF - 第一個應用程式章節中所述。
2	修改home.xhtml，如下所述。保持其餘檔案不變。
3	編譯並執行應用程式，以確保業務邏輯按要求工作。
4	最後，以 war 檔案的形式構建應用程式，並將其部署到 Apache Tomcat Web 伺服器中。
5	使用如下所述的適當 URL 啟動您的 Web 應用程式。

home.xhtml

<!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>
      <title>JSF Tutorial!</title>
   </head>
   
   <body>
      <h2>h:graphicImage example</h2>
      <hr />
      
      <h:form>      
         <h3>Image</h3>
         <h:graphicImage value = "/images/jsf-mini-logo.png"/>
      </h:form>
   </body>
</html>

一旦您完成了所有更改，讓我們像在 JSF - 第一個應用程式章節中所做的那樣編譯並執行應用程式。如果您的應用程式一切正常，這將產生以下結果。

jsf_basic_tags.htm

列印頁面

上一個

下一個