§ target 屬性
- target 屬性可以指定連結的目標視窗。
- 我們可以在<head>區中加入 base target="" 的敘述，設定網頁的預設連結目標。
| target="_blank" |
開新視窗(另外開啟一個新的瀏覽器視窗來顯示文件) |
| target="_top" |
整頁(破除所有的窗格設定，讓視窗佔滿整個瀏覽器視窗) |
| target="_self" |
目前的視窗(出現在目前網頁的視窗中，在frame中才能顯現效果) |
| target="_parent" |
父視窗(回到上一層的視窗設定) |
| target="視窗名稱" |
將文件顯現在指定的視窗名稱中(在frame中使用) |
§ target="_blank"
- 不用管現在的連結是在什麼情況，反正就是另外開一個瀏覽器視窗來呈現指定的連結內容
- 假如使用FrontPage在「框架頁」中若設定：
<frameset
cols="150,650">
<frame src="檔名" target="_blank">
..............
..(底下省略)..
..............
則在載入該文件時，會自動在出現在該視窗的文件中<head>區加入<base target="_blank">敘述。
為了避免混淆不清，最好是把frameset 中的 target = "" 敘述全部刪掉。
- 小視窗中的文件是獨立的，因此，我們可以在個別載入的文件中分別設定，這樣就不會搞混了！
- <base target="_blank">：表示這個網頁的預設連結目標是_blank(開新視窗)，您可以在作超連結不用再另外指定連結目標，它會以預設的目標視窗(_blank)作連結。當然，也可以再用
target 改變預設值。
- 連結到別人的網頁時，就好都用「開新視窗」。
＊ 範例 (開新視窗)
§ target="_top"
- 打破所有分割視窗的框框限制，以"整頁"的方式來呈現網頁的內容。
- 和上面不同的是：它並不是另外開啟一個新的視窗，而是佔滿整個瀏覽器視窗
＊ 範例 (整頁顯示)
§ target="_self"
- 連結的內容出現在"目前的窗視"中，在frame中才能顯現出效果，通常用在位於右邊或下方的分割視中。
- 假如，此頁不是分割視窗，和 target="_top" 的結果是一樣的
- 它是預設值。
- 假如，在<head>區中，利用<base
target="....">
指定其它的視窗名稱，而有一個單獨的連結想出現在目前的視窗中，可以用此指定。
＊ 範例 (目前視窗)
§ target="視窗名稱"
- 連結的內容出現在"指定的視窗中"，在frame中才能顯現出效果。
- 在分割視窗中最常見的就是左邊放按鈕、按下按鈕時，讓內容顯示在右邊窗格中
＊ 範例 (指定視窗名稱)
§ target=_parent
＊ 範例 (連結到父視窗的窗格中)
§ 巢狀分割
- 巢狀分割就是分割了小視窗後，再把小視窗作分割。
- 語法：(以下就是一個最常用的巢狀分割範例)
<frameset
cols="170,630" >
<frame
src="檔名.htm" name="aal">
<frameset
rows="75,*" >
<frame
src="檔名.htm" name="aart">
<frame
src="檔名.htm" name="aarb">
</frameset>
</frameset>
- 這裏比較難想像，網友可以對照上面的程式碼。上面的程式碼就是先將一個視窗分成兩個
(左視窗 170 pixels、右視窗 630 pixels)，再把右邊的視窗分成上下兩個(上面是 75 pixels、下面不指定大小)。
＊ 範例
§ <noframes>....</noframes>標籤
- 瀏覽器品牌眾多，並非每一種都支援frame的架構，為了照顧一些「弱勢族群」，有人會在 <frameset>...</frameset> 中加入<noframes>的標籤，讓使用不支援frame的瀏覽器的網友也能看到貴站的內容。
- 這個標籤裏所有的文件敘述，在有支援frame的瀏覽器中是完全不會顯現出來的。
- <noframes>....</noframes>之間可以是完整的網頁文件，也可以只是簡單的幾行敘述。大部分的人都是選用後者，簡單的告知本站使用frame架構。
- 「西瓜偎大邊」，我想很少人會為這些少數族群另外再準備一份文件吧！
- 要注意的是底下的 <noframes> 標籤裏又捨棄了<frameset> 標籤 (因為對方的瀏覽器看不懂)，回復成 <body> 標籤的用法。
- 語法：
<frameset
cols="150,650">
<frame src="檔名"
name="contents">
<frame src="檔名"
name="main">
<noframes>
<body>
<p>此網頁使用框架,但是您的瀏覽器並不支援.
</body>
</noframes>
</frameset>
＊ Tips：
- 同時更換兩個以上的分割視窗的內容
- 這部分本來不是HTML的範圍 (單是靠HTML是辦不到的！)可是，它卻是常用的一個功能。
- 要達到這種同時更新兩個分割視窗的功能，需要JavaScript的協助才行。
- 在範例中「檢視原始碼」可以看見 loader() 函式，把它copy起來，放在
<head> 區。(其中 load01、load02 分明是右上、右下的視窗名字)， 然後在連結時仿照例子呼叫它就可以了。
＊ 範例 (短短幾行的JavaScript就可以辦到了哩！)
§ 浮動窗格
-- <iframe>
- 目前只有 IE 支援它，Netscape
並不支援。可是愈來愈多人使用它了，本站因此不得不做此介紹。至於，是否要使用它，取決於網友們。
- 浮動視窗和前面所講的「分割視窗」是不同的。在「分割視窗」中，需要有一個「框架頁」的文件來設定分割。而「浮動視窗」是直接嵌入網頁文件中(包含在網頁文件中)，並不需這樣的宣告，而且它能在網頁文件中任意的擺放。
- <iframe>標籤就是用來定義「浮動窗格」的。
＊ 範例
- src 屬性，和<frame>中的設定是一樣的。可以指定要載入的網頁位址。
- 語法：
<iframe src="檔名.htm">
- name
屬性，可以為此浮動視窗命名。作用和上面的「分割視窗」是一樣的。
- 語法：
<iframe name="ifdata">
(經此設定，這個浮動窗格的名稱便是 ifdata)
- align 屬性，設定浮動視窗在視窗的擺放位置。
- 語法：
<iframe align="left">
靠左對齊
<iframe align="center"> 置中對齊
<iframe align="right"> 靠右對齊
- width、height 屬性，設定浮動視窗的寬及高。
- 可以用百分比(%)，也可以用像素(pixes)。
- 語法：
<iframe width="70%"
height="88%">
- frameborder 屬性，設定是否要有邊框。
- 浮動視窗的邊框是3D立體的。
- 設定值可以是1 或 0 。設為 1 時，表示要有邊框。設為 0
時，不會出現邊框。
- 語法：
<iframe frameborder="1">
- marginwidth、marginheight
屬性，可以設定左右邊界、上下邊界留白。
- 以像素(pixels)為單位。
- 語法：
<iframe marginwidth="10"
marginheight="15">
- scrolling 屬性，設定是否要出現捲軸。
- 設定值可以是yes、no、auto
，和上面的「分割視窗」是一樣的。
- 語法：
<iframe scrolling="auto">
- 可以在</iframe> 結束標籤前，寫上瀏覽器不支援 iframe
時的訊息文字。
- 語法：
<iframe align="center"
src="../joy/joy001.htm" width="80%"
height="70%">
本頁使用浮動視窗，可惜您的瀏覽器並不支援它。
</iframe>
- <iframe>使用上似乎比「分割視窗」更簡易、更直覺。真搞不懂為什麼一些瀏覽器不支援它！<marquee>標籤也是一個很好用的功能，情形也是一樣。個人覺得，其實，HTML
語法並不難，是現今的瀏覽器對它的支援程度不同，把它變得複雜化、把它變難了！
下一頁
版權所有© 未經本站同意，不得作任何形式之轉載或商業用途
-- 網奕工坊 -- 站長信箱： tn705939@ms7.tisnet.net.tw