第 9 章 分割視窗 - Frame 著作權所有 © 旗標出版股份有限公司
本章提要 令人眼睛為之一亮的分割視窗 Frame 基本架構介紹 <FRAME> 標籤的進階使用 Target Window 介紹 Inline Frames
令人眼睛為之一亮的分割視窗
令人眼睛為之一亮的分割視窗 分割視窗的操作特色 如何在有分割視窗的網站內進退自如
分割視窗的操作特色 對網頁設計者而言 可以對網頁做更多的掌控與變化 使網站更具層次感 對瀏覽網站的使用者而言 易於瀏覽網站
如何在有分割視窗的網站內 進退自如 若遇到沒有留下覽用的超連結網站, 請使用工具列上的上一頁或下一頁鈕切換。或在分割視窗中按滑鼠右鈕:
Frame 基本架構介紹 Frame 實作初探 製作分割視窗--<FRAMESET>…</FRAMESET> 標籤 將 HTML 檔嵌入分割視窗-- <FRAME> 標籤 <NOFRAMES> 標籤
Frame 實作初探
製作分割視窗 <FRAMESET>…</FRAMESET> 標籤:
製作分割視窗
FRAMESET 的 COLS 與 ROWS 屬性 <FRAMESET ROWS="*,*"> - 上下分割
使用 COLS 與 ROWS 屬性來設定分割視窗的大小
使用 COLS 與 ROWS 屬性來設定分割視窗的大小
使用 COLS 與 ROWS 屬性來設定分割視窗的大小 將上面範例改寫, 則結果會與上面範例相同:
使用 COLS 與 ROWS 屬性來設定分割視窗的大小
設定 FRAMESET 邊界寬度的屬性 FRAMEBORDER:設定是否顯示窗格的邊界。 BORDER:設定窗格分界處的厚度。 BORDER COLOR:設定分割線的顏色。 FRAMESPACING:與 BORDER 相同, 但只有 IE 認得。
<FRAME> 標籤的屬性 SRC 屬性:指定 HTML 檔, 其語法為 <FRAME SRC="HTML 網頁的 URL">。 NAME 屬性:為分割視窗命名, 分割視窗的名字必須由英文字母或數字符號開頭。其語法為 <FRAME NAME="這個視窗的名字">。
<FRAME> 標籤的屬性 SCROLLING 屬性:設定分割視窗的捲軸, 預設值是 AUTO, 表示內容沒有超過分割視窗大小時就不加上捲軸;一旦內容超出分割視窗的大小, 就自動加上捲軸。 當指定 SCROLLING="YES" 時, 不管內容多寡都會加上捲軸。反之, 當 SCROLLING="NO" 時, 不管內容多寡都不會加上任何捲軸。
<FRAME> 標籤的屬性 NORESIZE 屬性:鎖住分割視窗的大小。若不希望使用者可以任意更動分割視窗的大小, 加上 NORESIZE 屬性。
<FRAME> 標籤的屬性 <FRAME MARGINWIDTH=與左右邊界距離>, 用來設定內容與左右邊界的距離。 左右邊界最好設定一點以上, 以防止視窗內的內容觸碰到邊界。
<FRAME> 標籤的屬性 <FRAME MARGINHEIGHT=與上下邊界距離>:
<FRAME> 標籤的屬性
<NOFRAMES> 標籤 為了照顧尚未支援分割視窗語法的瀏覽器, 可以在 <FRAMESET>… </FRAMESET> 之間加上 <NOFRAMES>…</NOFRAMES> 標籤。 然後在 <NOFRAMES> 標籤中加入一段說明文字, 而未支援分割視窗標籤的瀏覽器, 可以看到這段說明文字。
<FRAME> 標籤的進階使用 <FRAMESET> 的巢狀結構 <FRAME> 的 NAME 屬性與 <A HREF> 的 TARGET 屬性 有 FRAME 相助, 層次分明
<FRAMESET> 的巢狀結構
<FRAMESET> 的巢狀結構
<FRAME> 的 NAME 屬性與 <A HREF> 的 TARGET 屬性
<FRAME> 的 NAME 屬性與 <A HREF> 的 TARGET 屬性
<FRAME> 的 NAME 屬性與 <A HREF> 的 TARGET 屬性 在 Ex09-08.htm 檔中, 會分別載入 Ex09-08a.htm 與 Ex09-08b.htm:
<FRAME> 的 NAME 屬性與 <A HREF> 的 TARGET 屬性 在 Ex09-08a.htm 中, 當按下左邊視窗中的超連結時, 右邊的分割視窗, 就會出現新的網頁內容:
有 FRAME 相助, 層次分明
有 FRAME 相助, 層次分明
有 FRAME 相助, 層次分明
<BASE TARGET="分割視窗的名字"> 以 Ex09-09a.htm 為例, 可加上 <BASE TARGET="HOMEBODY"> 來取代所有的 TARGET="HOMEBODY":
<BASE TARGET="分割視窗的名字">
Target Windows 介紹 TARGET=_blank TARGET=_self 再開啟一瀏覽視窗, 並顯示所要連結的網頁。 在目前視窗中顯示所要連結的網頁。 若目前網頁上設定 <BASE TARGET="某個分割視窗">, 會讓連結的畫面呈現在某個分割視窗中。
Target Windows 介紹 TARGET=_top TARGET=_parent 將瀏覽器內所有分割視窗拆掉, 使連結的網頁顯示在瀏覽器的主視窗上。 TARGET=_parent 將上一層 <FRAMESET> 所設定的分割視窗拆掉, 使連結的網頁顯示在上一層分割視窗內。
Frame 疑難雜症解決- Frame 外的天空 在指向外面的 <A HREF> 中加上 TARGET="_top" 可避免讓別人的網頁陷在自己的網頁上, 而造成侵權的爭議。
Frame 疑難雜症解決-Frame 與 Frame 相疊, 如何尋回來時路
Frame 疑難雜症解決-Frame 與 Frame 相疊, 如何尋回來時路
Frame 疑難雜症解決-Frame 與 Frame 相疊, 如何尋回來時路
Frame 疑難雜症解決-Frame 與 Frame 相疊, 如何尋回來時路
Frame 疑難雜症解決-Frame 與 Frame 相疊, 如何尋回來時路
Frame 疑難雜症解決-Frame 與 Frame 相疊, 如何尋回來時路
Inline Frames 為了解決 <FRAME> 與 <BODY> 標籤無法共用之缺點, 微軟提出了 Inline Frames 的觀念。 Inline Frames 的性質近似於 <IMG> 標籤所置入的圖片, 所以稱為 Inline Frames。
<IFRAME>…</IFRAME>-- 定義窗格 <IFRAME> 標籤不是用在 <FRAMESET> 之中, 而是用在 <BODY>…</BODY> 中。它的功能是在一般的網頁中建立窗格, 有點像電視上的子母畫面:
<IFRAME>…</IFRAME>-- 定義窗格
<IFRAME> 的屬性 ALIGN – 設定窗格與文字的對齊方式。 FRAMEBORDER – 設定窗格邊線的厚度。 HEIGHT、WIDTH – 設定窗格的高度與寬度。 MARGINHEIGHT、MARGINWIDTH – 設定顯示內容與上下、左右邊界的距離。 NAME – 設定窗格的名稱。 SCROLLING – 設定捲軸顯示的方式。
妙用無窮的 <OBJECT>
妙用無窮的 <OBJECT>