標題標題  顯示論壇會員列表名單  搜索論壇搜索  HelpHelp
  注冊注冊  登入登入
ASP教學區
 DoReMe : ASP教學區
主題 話題: 第五章 初級HTML 回復發表新主題
作者
貼子內容 << Prev Topic﹐ 下一個主題 >>
koioggo
Groupie
Groupie


加入: 2004/5月/22
Online Status: Offline
回復: 58
Posted: 2004/11月/16 12:30下午 | IP記錄 引用 koioggo

HTML中基本的文本格式

只包含單一文本的網頁是很單調的，要建立一個具有吸引力的網頁，你需要控制文本的大小、顏色、字體等一系列屬性。在本節中，你將 學習如何控制這些屬性。

使用字體

<FONT>標識符在本章前部分已簡單提起過，它具有三個屬性：SIZE、COLOR和FACE。下面是個使用SI ZE屬性的例子：

<HTML>

<HEAD>

<TITLE> Font Sizes </TITLE>

</HEAD>

<BODY>

<FONT SIZE=1> I am small. </FONT>

<P>

<FONT SIZE=7> I am big! </FONT>

<P>

<FONT SIZE= +1> I am a little bigger than the base font. </FONT>

<P>

<FONT SIZE= -1> I am a little smaller than the base font. </FONT>

<P>

</BODY>

</HTML>

你可以通過在1~7間選個數來設定SIZE屬性的值來指定文本的大小，1是最小的字體，而7是最大的。這是一個指定文本絕對大小 的方法。另外你也可指定文本的相對大小，如果你仔細察看下面的代碼，你能發現SIZE屬性的值被設為+1，就告訴瀏覽器以比基本 字體大一號的字體來顯示文本。

基本字體的大小由<BASEFONT>標識符來指定，你也可以不使用這個標識符，如上例所示，這種情況下基本字體就 由瀏覽器來設定。

<BASEFONT>標識符與<FONT>的用法相似，只不過<BASEFONT>對整個 文件都起作用，<BASEFONT>標識符只能在文件中使用一次，並應該放置於所有<FONT>標識符 之前，下面是一個使用這個標識符的例子：

<HTML>

<HEAD>

<TITLE> Base Font </TITLE>

</HEAD>

<BODY>

<BASEFONT SIZE=6>

I am big.

<P>

<FONT SIZE= +1> I am bigger! </FONT>

</BODY>

</HTML>

I am big. 將以<BASEFONT>設置的文本大小來顯示。大小是6。而I am bigger! 顯示出來字體要大一號，是7。

你不能保證你網頁上的文本將會以你設定的絕對大小來顯示，最終在瀏覽器上顯示的文字的大小可以由用戶來設定，用戶有最終決定權。 因此當你的網頁在瀏覽器上顯示時，所有的文本可能比你所期望的要大或小。

你可以控制你網頁上的文本的顏色，這可通過設置<FONT>標識符的COLOR屬性的值來完成，如下所示：

<HTML>

<HEAD>

<TITLE> Color Fonts </TITLE>

</HEAD>

<BODY>

<FONT COLOR=」GREEN」> I am green. </FONT>

<P>

<FONT COLOR=」RED」> I am red. </FONT>

</BODY>

</HTML>

在此例中，第一個句子的顏色是綠色，而第二個句子是紅色。使用顏色的名字是指定文本顏色的簡單方法。但是，為了保障網頁在所有瀏 覽器上的兼容性，你應當使用使用RGB值（附錄D列出了所有顏色及其RGB值）

<FONT>標識符還有一個比較有用的屬性FACE，使用它可以指定文本的字體，下面是一個例子：

<HTML>

<HEAD>

<TITLE> Font Face </TITLE>

</HEAD>

<BODY>

<FONT FACE=」Courier」> I am Courier. </FONT>

<P>

<FONT FACE=」Courier」> I am Arial, but if that does not work,

I am Courier. </FONT>

</BODY>

</HTML>

當在網頁上顯示這個HTML文件時，第一個句子的字體是Courier，而第二個句子是Arial。當然，可能會是這樣的。瀏覽 器軟件在它運行的機器上盡可能的做的更好。不是所有的計算機都有某一種字體。例如，如果這台計算機上沒有Arial字體，那麼瀏 覽器就會使用FACE屬性指定的下一個字體，再上例中就會使用Courier字體。你可以盡可能的列出你所需要的替換字體。

對我個人而言，我經常使用<FONT>標識符，但是你應當認識到它有某些限制。當使用它時，你應當注意背景和前景的 兼容性問題。

相對來說，<FONT>標識符是比較新的，在舊版的瀏覽器上它不會起作用。例如在Netscape Navigator 3.0上可以識別<FONT>的SIZE和COLOR屬性，但卻不能識別FACE屬性。其他的瀏覽器乾脆就不識別& lt;FONT>標識符。

<FONT>標識符是當前HTML規範中的一部分，但FACE屬性卻不是。進一步說，在不遠的將來，<FON T>標識符可能會從HTML規範中去掉，<FONT>標識符的所有功能可能會被cascading style sheets（見第七章）代替。當你使用這個有用的標識符時應該牢記這些兼容性問題。

建立大字體及小字體

如果你不想使用<FONT>標識符來控制文字的大小，你可以使用<BIG>和<SMALL> ;標識符來顯示大字體或小字體。顯而易見，<BIG>使你的文字比正常文字看起來更大，而<SMALL> ;使你的文字看起來比正常文字要小。下面是一個例子：

<HTML>

<HEAD>

<TITLE> Big and Small </TITLE>

</HEAD>

<BODY>

<BIG> How big of you. </BIG>

<P>

<SMALL> How small of you. </SMALL>

</BODY>

</HTML>

加入標題

標題對於把一段文字分成許多小節是很有用的，它也可用來控制在網頁上顯示時的字體大小（可代替<FONT>標識符的 SIZE屬性）。下面是一些使用<H>標識符的例子：

<HTML>

<HEAD>

<TITLE> Headings </TITLE>

</HEAD>

<BODY>

<H6> I am a small heading. </H6>

<H4> I am a medium heading. </H4>

<H1> I am a large heading. </H1>

</BODY>

</HTML>

你通過給標指定不同的數字來規定他們的大小，有６種大小的標題。例如由<H1>包含的文字在在瀏覽器上顯示是最大的 ，而由<H^>包含的文字顯示出來最小。

注意你並不需要使用<P>標識符來分行，因為緊跟在<H>後面的文字會自動從一個新行開始顯示，因此就 用不著使用<P>了。

從技術上來說，由<H>包含的文字說明了它們的重要性，而並不僅僅是尺寸不同。理論上，瀏覽器不應當把這種標題的重 要性僅僅以字體尺寸來反映，而應當以其他方式（如高亮度、加黑等）。然而在實際使用中，我用過的所有瀏覽器都把<H> ;看作尺寸標識符。
Back to Top 查看 koioggo's 資料 搜索其他貼子 koioggo 訪問 koioggo's
 
koioggo
Groupie
Groupie


加入: 2004/5月/22
Online Status: Offline
回復: 58
Posted: 2004/11月/16 12:33下午 | IP記錄 引用 koioggo

黑體、斜體、下劃線及刪除線

如我們前面所說的<B>標識符使文字以黑體顯示，要讓文字以斜體顯示，應把文字置於<I>之間。你也可 通過<U>來給文字加下劃線。最後如果你需要刪除線（有一道橫線穿過的文本），應該使用<STRIKE> ;或<S>標識符。下面是一些例子：（圖5.5是在瀏覽器上的顯示結果）

<HTML>

<HEAD>

<TITLE> Text Formatting </TITLE>

</HEAD>

<BODY>

<B> To boldly go where no? </B>

<P>

<I> Really? Really? Are you sure? </I>

<P>

<U> I am not a hypertext link. </U>

<P>

<S> Strike One! </S>

<P>

<STRIKE> Strike Two! </STRIKE>

</BODY>

</HTML>

 

圖5.5 黑體、斜體、下劃線及刪除線的文本

要注意<STRIKE>和<S>標識符，如果你想在舊版的瀏覽器上有好的兼容性，就使用<STR IKE>。如果你想讓你的網頁在未來版本的瀏覽器上正確顯示，則使用<S>。

注意

原則上不要去使用<U>標識符，不要在你的HTML文件中使用——通常網頁中帶下劃線的文字表示這是一個超連接，使 用<U>會給用戶帶來困惑，如果你想強調某些文本，就使用<I>吧。

上標和下標

在某些不常見的情況下，你可能要使用上標和下標（出現在正常文本上端或下端的文字，如E=mc2和H2o）。你可以使用< SUP>和<SUB>標識符來實現。下面是怎樣使用這兩個標識符的例子：

<HTML>

<HEAD>

<TITLE> Superscript and Subscript </TITLE>

</HEAD>

<BODY>

<SUP> I』m feeling high. </SUP>

<P>

<SUB> I』m feeling low. </SUB>

</BODY>

</HTML>
Back to Top 查看 koioggo's 資料 搜索其他貼子 koioggo 訪問 koioggo's
 
koioggo
Groupie
Groupie


加入: 2004/5月/22
Online Status: Offline
回復: 58
Posted: 2004/11月/16 12:33下午 | IP記錄 引用 koioggo

閃爍的文本

在沒有哪個HTML標識符比<BLINK>更令人討厭的了。人們通常一看到閃爍的東西就不加思索的點擊他們的瀏覽器 的返回鍵了。只有Netscape Navigator才支持這一標識符，它也不是HTML 3.2規範中的一部分。Microsoft也拒絕在它的Internet Explorer中支持這個標識符。下面是一個使用<BLINK>的例子：

<HTML>

<HEAD>

<TITLE> Blinking Text </TITLE>

</HEAD>

<BODY>

<BLINK> Blink, blink </BLINK>

</BODY>

</HTML>

如果你想要人們再次參觀你的網點，你可要小心地使用這一標識符。

加入特殊字符

某些情況下，你要輸入一些鍵盤上沒有的字符。例如你要輸入一些版權及商標符號，或使用一些外文符號，你可以通過字符碼的在你的網 頁中加入這些特殊字符。如下例所示（見圖5.6）：

<HTML>

<HEAD>

<TITLE> Special Characters </TITLE>

</HEAD>

<BODY>

I am copyrighted &copy;

<P>

I am a registered tradmark &reg;

<P>

My name is Kurt G&ouml;del

</BODY>

</HTML>

在這個例子中，表達式&copy產生了版權符號，&reg產生了註冊商標符號，而&ouml在小寫字母 o上產生了德語中的曲音符號（關於這些特殊字符的全部列表，可參閱附錄D）。

 

圖5.6 版權、註冊及音標符號

當使用這些特殊字符表達式時，你需要全部用小寫字母來輸入。例如在Netscape Navigator （版本3.0或4.0）上，表達式&Copy是不會產生版權符號的，而只會顯示出實際上你輸入的東西。

這些特殊字符的另一個應用是用來產生大於及小於符號（< 和 >），你可能會奇怪鍵盤上明明有這兩個字符，為何還要通過特殊字符來顯示它們？問題就在於如果你直接在你的HTML文件中 輸入< 和 >符號，瀏覽器會將他們解釋成HTML標識符，而不是< 和 >字符。因此你必須使用特殊字符，如下例所示：

<HTML>

<HEAD>

<TITLE> Special Characters </TITLE>

</HEAD>

<BODY>

HTML Lesson 1:

<P>

How to use the &lt;BR&gt; tag.

</BODY>

</HTML>

在此例中，你輸入&lt和&gt來產生大於和小於符號（見圖5.7）。如果你想在你的網頁上顯示一個HTML標 識符，而不是使用它，那麼你就得使用這兩個表達式。

 

圖5.7 顯示HTML標識符

最後一個值得一提的特殊字符是空格。假如你想縮進一段文本的第一句話，實現這一目的的一個方法是使用特殊表達式&nbs p，如下例所示：

<HTML>

<HEAD>

<TITLE> Creating Space </TITLE>

</HEAD>

<BODY>

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;I am the first sentence in this paragraph

and I am indented. <BR>

I am the second sentence and I am flush left.

</BODY>

</HTML>

通過在此行插入五個空格字符，你就獲得了五個字符寬度的縮進。

使用特殊字符要小心，雖然現版的瀏覽器軟件都能使用它們，但當你在不支持他們的瀏覽器上使用時，你就會得到錯誤的結果。通常一個 瀏覽器不能識別HTML標識符時，它就會忽略它，而不會造成顯示上的混亂。然而，特殊字符不是真正的HTML標識符，當瀏覽器不 能識別它們時就會在屏幕上顯示出你實際輸入的東西，這就變得特別難看了。

Back to Top 查看 koioggo's 資料 搜索其他貼子 koioggo 訪問 koioggo's
 
koioggo
Groupie
Groupie


加入: 2004/5月/22
Online Status: Offline
回復: 58
Posted: 2004/11月/16 12:33下午 | IP記錄 引用 koioggo

連接HTML頁

如果不存在超連接，環球網就不算是網絡了。超連接使你能從一個HTML文件連到另一個。你只需用鼠標輕輕點一下就能從一個網頁跳 到另一個，而不費一點功夫。在本節中，你將學習怎樣把你的網頁連到全球網上去，當然第一步你需瞭解Internet地址是如何工 作的。

理解Internet地址

你可以在您的網絡瀏覽器的地址框中輸入http://www.hotwired.com來參觀HotWired的網點。當年輸入時http://www.hotwired.com時，你實際上在輸入一個統一資源定位器（URL），URL也可被看作是網頁的地址，雖然它們也可以是其它類型文件的地址。

注意

一般地，URL的發音是「You are Elle」，而不是earl 。

一個URL包含三個部分：

第一部分告訴瀏覽器你將使用何種網絡協議與Internet進行通信。當使用網絡瀏覽器時，你經常使用超文本傳輸協議（HTTP ），因為通常你要接收HTML文件，而HTTP是在Internet上從一台計算機傳輸文件到另一台計算機的協議。

URL的第二部分提供你想要連接的資源的域名。例如，因為HotWired在Internet上註冊了一個域名：www.hotwired.com，你就可以在你的瀏覽器的地址條中輸入http://www.hotwired.com來獲得這個網點的主頁。

通常HotWired的網點有不止一個網頁，實際上，大部分的商業網址都有幾十到幾百個網頁，它們被組織在不同的目錄下。如果你 要瀏覽HotWired站點上的某一特定網頁，而不是它的主頁，那麼你就要提供附加的地址信息，在URL的第三部分，你就要提供 你感興趣的某一HTML文件的位置。

假如您想瀏覽HotWired網點的一個名為new.cfm的文件，在這種情況下，你可以在瀏覽器的地址框中輸入http://www.hotwired.com/new.cfm來獲得這一特定的HTML文件。URL的最後一部分就指明了你所感興趣的HTML文件。

通常，HTML文件在網點上是組織在不同的子目錄下的。例如，HotWired網點上有兩個名為new和old的子目錄，每個目 錄下都有許多文件，要想瀏覽new子目錄下的HTML文件new.cfm，你就要輸入： http://www.hotwired.com/new/new.cfm 。如果這個文件被安置在old目錄下，你就要輸入：http://www.hotwired.com/old/new.cfm。可見，地址很快就變得很長了，這也是為什麼超連接非常重要的原因。
Back to Top 查看 koioggo's 資料 搜索其他貼子 koioggo 訪問 koioggo's
 
koioggo
Groupie
Groupie


加入: 2004/5月/22
Online Status: Offline
回復: 58
Posted: 2004/11月/16 12:34下午 | IP記錄 引用 koioggo

網點間的聯結

將你的網頁與環球網上的其他網頁相連，你將要使用一種稱為超文本定位器的東西，你可以使用<A>標識符來建立一個超 文本定位器。下面的例子說明了怎樣在你的網頁中與HotWired的網點相連接：

<HTML>

<HEAD>

<TITLE> Inter-site Anchor </TITLE>

</HEAD>

<BODY>

<A HREF=http://www.hotwired.com> HotWired </A>

</BODY>

</HTML>

　

注意<A>是個容器標識符，由它所包含的文字是一個超連接。在此例中，瀏覽器上顯示出的HotWired帶有一道下 劃線，這就告訴用戶這是一個超連接，如果用鼠標點擊這個字符，那麼HotWired網點的主頁就會在你的瀏覽器上顯示出來。

你在<A>的HREF屬性中提供網頁的地址，這個地址可以是世界上任何一個網點的任何一個網頁的URL。你可以很輕 鬆的將你的網頁連接到香港的網點上或是加利福尼亞的網點上。

注意

一般而言，你並不需要取得其他網點的作者的允許來將你的網頁與他們的相連，大部分網頁製作者都希望有盡可能多的連接到他們的網頁 上，在你的網頁上加入與他們主頁的超連接，實際上是增加了他們網頁的潛在客戶。

一個HTML文件可以根據你的需要加入超連接。例如，你需要在一個網頁上連接到一些Internet上的搜索引擎，你可以輸入如 下的代碼：

　

<HTML>

<HEAD>

<TITLE> Inter-site Anchor </TITLE>

</HEAD>

<BODY>

<A HREF=http://www.yahoo.com> Yahoo </A>

<P>

<A HREF=http://altavista.digital.com> Alta Vista </A>

<P>

<A HREF=http://www.excite.com> Excite </A>

</BODY>

</HTML>
Back to Top 查看 koioggo's 資料 搜索其他貼子 koioggo 訪問 koioggo's
 
koioggo
Groupie
Groupie


加入: 2004/5月/22
Online Status: Offline
回復: 58
Posted: 2004/11月/16 12:39下午 | IP記錄 引用 koioggo

在網點內部連接

你的網點上可能不只一個網頁，而且你希望你的網點的用戶能夠輕鬆的從一頁跳到另一頁，要實現這一點，你需要把你網點中的頁連接在 一起。在網點內部建立連接與在網點間建立連接是一樣的。表5.1和5.2 顯示了兩個HTML文件，分別叫this.cfm和that.cfm，它們通過<A>標識符互相連接在一起：

　

表5.1 文件this.cfm

<!-- This -->

<HTML>

<HEAD>

<TITLE> Inter-site Anchor </TITLE>

</HEAD>

<BODY>

<A HREF=」that.cfm」> That </A>

</BODY>

</HTML>

　

　

表5.2 文件that.cfm

<!-- That -->

<HTML>

<HEAD>

<TITLE> Inter-site Anchor </TITLE>

</HEAD>

<BODY>

<A HREF=」this.cfm」> This </A>

</BODY>

</HTML>

　

如果你將這兩個文件存在同一個目錄下，並起名為：this.cfm和that.cfm，那麼你用鼠標點機this，就連接到th is.cfm，反之亦然。

注意<A>的HREF屬性的值，這不是一個完全的Internet地址，因為它僅僅提供了HTML文件的名字而沒有 指明協議和域名。一個完整的Internet 地址稱為絕對URL，而此例中的部分地址被稱為相對URL。

你當然可以使用絕對URL來指定一個HTML文件，但如果你是在同一台計算機或是同一個網點中建立連接，還是使用相對URL會較 好些。這不僅僅是因為相對地址短小簡單，而

且當以後將你的HTML文件移入一個新的子目錄中時會方便些。

假設你的網點上有一個目錄叫maindir，在此目錄下有兩個子目錄稱為subdir1和subdir2，this.cfm文件 放於subdir1下，而that.cfm 放於subdir2下，使用下面所述的絕對URL和相對URL您可以在this.cfm和that.cfm間建立連接：

<-- This -- >

<HTML>

<HEAD>

<TITLE> Inter-site Anchor </TITLE>

</HEAD>

<BODY>

<A HREF=」http://www.yourdomain.com/maindir/subdir2/that.cfm」> That </A>

<P>

<A HREF=」/maindir/subdir2/that.cfm」> That </A>

<P>

<A HREF=」../subdir2/that.cfm」> That </A>

</BODY>

</HTML>

此例中的三個URL地址都能連接到正確的文件。第一個地址使用了that.cfm的絕對URL，只有當that.cfm文件是存 於maindir的subdir1子目錄下時它是起作用的。

第二個地址使用了相對URL，因為this.cfm和that.cfm存在於同一個網點上，不再需要指明域名了。實際上，，如果 你網點的域名變更了，或是你將這些HTML文件從一台網絡服務器上傳到了另一台上，this.cfm和that.cfm間的連接 仍然是有效的。

第三個地址也用了相對URL，相對地址 ../subdir2/that.cfm中的兩個圓點（..）表明當前文件所在目錄的父目錄。由於this.cfm的父目錄是m aindir，因此這個URL就等效於/maindir/subdir2/that.cfm，這也是個正確的URL。

相對URL一般都比絕對URL要好，因為使用相對URL對於網點目錄結構的改變時適應性更強，不會像絕對地址那樣會造成連接的失 敗。如果你將目錄maindir改為別的名字，上例中的第三個地址仍能正確工作。甚至你將maindir及其下的所有子目錄都移 到另一新的目錄下，這個地址仍是正確的，因此應盡量使用相對地址。

Back to Top 查看 koioggo's 資料 搜索其他貼子 koioggo 訪問 koioggo's
 
koioggo
Groupie
Groupie


加入: 2004/5月/22
Online Status: Offline
回復: 58
Posted: 2004/11月/16 12:43下午 | IP記錄 引用 koioggo

網頁內部的聯結

有時你需要跳到同一網頁的某個特定位置去，這種超連接也是很有用的。例如，你的網頁頂部是一張內容目錄，希望用戶只要用鼠標點一 下目錄上的特定部位就能跳轉到文檔的相應章節去。你可以使用<A>標識符來建立這種超連接。表5.3就是一個例子：

　

表5.3 目錄表的連接

<HTML>

<HEAD>

<TITLE> Linking Within A Web Page </TITLE>

</HEAD>

<BODY>

<H1> Contents </H1>

<A HREF=」#section1」> Section Ⅰ </A>

<BR>

<A HREF=」#section2」> Section Ⅱ </A>

<P>

<A NAME=」#section1」> Section Ⅰ </A>

<BR>

This is the first section.

<P>

<A NAME=」#section2」> Section Ⅱ </A>

<BR>

This is the second section.

<A HREF=」that.cfm」> That </A>

</BODY>

</HTML>

　

在此例中，網頁的頂部是兩部分的目錄，如果用鼠標任點一個，就會立即跳轉到文檔的相應部分中去（見圖5.8）。

你可使用<A>的NAME屬性在文檔中建立定位，當你使用NAME屬性時，你建立的不是一個超連接，而是一個超連接 所連接的目標。你可以在網頁中根據需要建立許多定位，並為每個定位取你喜歡的名字。

要建立一個指向定位的超鏈接，你可以使用HREF屬性，當然，你必須在你要鏈接的定位的名稱前加上符號＃。在上述例子中，標識符 <A HREF=」#section1」>鏈接到文檔中名為section1的定位。

 

圖5.8 與目錄連接

如果你需要，你可以為同一個定位指明多個超鏈接。如果你的網頁很長，則這將是很有用的。例如你要為用戶提供一個簡單的辦法快速回 到文檔的頂部，下面的例子說明了如何去做：

<HTML>

<HEAD>

<TITLE> Multiple Links Within A Web Page </TITLE>

</HEAD>

<BODY>

<A NAME=」TOP」> Welcome </A>

…some long text…

<A HREF=」#top」> Back To Top </A>

…some more long text…

<A HREF=」#top」> Back To Top </A>

</BODY>

</HTML>

你也可以用在另一個HTML文件中的<A>標識符建立對一個定位的超鏈接。例如，你已經在that.cfm中建立了 一個定位稱作there_in_that，可以在this.cfm使用下面的語句來建立一個指向此定位的超鏈接：

<A HREF=」that.cfm #there_in_that」> Go There </A>

當用戶瀏覽this.cfm時，用鼠標點擊Go There，網頁就會眺轉到that.cfm中名為there_in_that的定位所在的位置。

你可以將表達式#there_in_that看作一種擴展的URL地址。它通過指定同一個或另一個HTML文件中特定的定位來擴 展一般的URL地址。包含有定位的文件可以是你當地網站上的文件或是環球網上的任何一個文件。

Back to Top 查看 koioggo's 資料 搜索其他貼子 koioggo 訪問 koioggo's
 
koioggo
Groupie
Groupie


加入: 2004/5月/22
Online Status: Offline
回復: 58
Posted: 2004/11月/16 12:43下午 | IP記錄 引用 koioggo

控制超鏈接的顏色

在Netscape Navigator中，一個超鏈接在點擊它之前的顏色是淺藍色，點擊它並鏈接到目的網頁後，這個超鏈接的顏色就變為紫紅色。而且 當鼠標的指針移動到超鏈接的位置並點擊它時，它的顏色變為了紅色。

你可以根據你的需要改變這些顏色，控制超鏈接顏色的三個屬性是LINK、VLINK和ALINK，它們都是BODY標識符的屬性 ，下面是個例子：

<HTML>

<HEAD>

<TITLE> Link Colors </TITLE>

</HEAD>

<BODY LINK=」lime」VLINK=」lime」 ALINK=」lime」>

<A HREF=」http://www.yahoo.com」> Yahoo </A>

</BODY>

</HTML>

在此例中，超鏈接Yahoo顯示的顏色在你點擊前、點擊時及點擊後都是草綠色。LINK屬性決定還未訪問的超鏈接的顏色，VLI NK屬性決定已訪問過的超鏈接的顏色，而ALINK屬性決定正在點擊超鏈接時它顯示的顏色。你可以用顏色名或RGB值來設定這些 顏色屬性。
Back to Top 查看 koioggo's 資料 搜索其他貼子 koioggo 訪問 koioggo's
 
koioggo
Groupie
Groupie


加入: 2004/5月/22
Online Status: Offline
回復: 58
Posted: 2004/11月/16 12:43下午 | IP記錄 引用 koioggo

加入圖像

Internet上的網站可分成兩種類型，一種使用大量的圖片，一種不使用圖片。一個極端的例子是象HotWired這樣的網站 ，每一頁幾乎都被各種各樣的圖片佔滿了。HotWired網站的這種設計使得它有非常鮮明的特色（見圖5.9）。

另一個極端的例子是如Amazon books這樣的網站。Amazon的網頁上幾乎沒有什麼圖片，每一頁上除了文字以外就幾乎沒有別的東西。這使得網頁傳輸顯示的 速度很快（見圖5.10）

哪種方法更好？這與你網點的目的有關。HotWired網點致力於向用戶提供各種特殊的圖片，因此在網頁中包含各種惹人注目的圖 片能獲得完美的效果。從另一方面來說，Amazon網站的目的是出售圖書，如果一個用戶要等待很長時間來調入一個網頁，他可能就 會乾脆到書店去買書了。

當設計你的網頁時，你可以在這兩種極端間找到一個平衡點。我好方法也有壞方法在你的網頁中加入圖片，如果您小心地選擇你的圖片類 型，你既可以讓將你的網頁生動有趣，也可以用較快的速度顯示。在這一節中你將學習怎樣做到這一點。

 

圖5.9 使用大量圖片的HotWired網站

 

圖5.10 幾乎不使用圖片的Amazon網站

GIF和JPEG

環球網上最常用的圖像格式是圖像交換格式（GIF），你可以把你網頁中的任何東西都用GIF圖像來實現，包括標誌、頁分隔及超鏈 接。GIF有很多你應當知道的性質：

首先，GIF圖像可以有不同大小的調色板，在一個GIF圖像中顯示的最大色彩數為256，然而，通常建立的圖像都採用較少的調色 板。減少GIF圖像的調色板大小可以顯著地減少圖像文件的大小，而越小的圖像文件調入網絡瀏覽器就越快。

GIF圖像具有透明色彩，如果你不想讓你的圖像以矩形區域來顯示，你可以設定一種透明色彩，這樣你可以將你的圖像邊緣設置成任何 一種形狀。當你想讓你網頁上的背景圖像或顏色透過前景圖像顯示出來，透明色彩就可以做到這一點。

GIF圖像可以交錯，當瀏覽器讀入一個交錯GIF圖像時，瀏覽器可以在全部讀入這個圖像文件前就開始顯示，這就給用戶一種快速顯 示的感覺。由於這個原因，你應該使用交錯GIF圖像而不是非交錯GIF圖像。

最後，GIF圖像可以用來創建動畫。你可以建立在一系列圖片中循環顯示的GIF圖像，而不是單一的圖像。

注意

GIF的發音是硬音或絲音的g。

GIF圖像不是環球網上唯一使用的一種圖像格式。另一種格式，靜止圖像專家組（JPEG）格式也是廣泛使用的，使用JPEG格式 的圖像都有jpg的擴展名。

為什麼有兩種圖像格式？每種格式都適用於一些特定類型的圖片。

注意

JPEG的發音是「jay peg「。

通常在網頁上顯示照片用JPEG格式較好──JPEG適合顯示有許多不同顏色的圖像，這有下面的原因：

與GIF不同，JPEG圖像不局限於256種顏色，JPEG圖像可以有上百萬種色彩，當然這並不意味著所有的顯示器都能顯示這些 顏色。

第二個理由涉及到兩種格式對圖像數據的壓縮方式。如果你用GIF格式建立了一個有許多不同顏色的圖像，這個文件的大小就會比用J PEG格式創建的大得多。這一點是很重要的，因為網絡瀏覽器總是在讀入小文件時要快些。

在大部分情況下，你可以用GIF格式為你的網頁創建圖像，一般GIF圖像比較小，調入比較快。它們還可以設定透明色彩，而JPE G則不具有這一特性。

注意

第三種圖像格式現在用得還不多，但在不久的將來可能會大量使用。World Wide Web Consortium推出了PNG（發音ping）格式，作為GIF格式的替代品。GIF格式的一個問題是它不是公開的，它最初 是由CompuServe開發的。雖然GIF格式是私有的，但你可以在你的網頁中使用GIF圖像而不用支付任何費用。

Back to Top 查看 koioggo's 資料 搜索其他貼子 koioggo 訪問 koioggo's
 
koioggo
Groupie
Groupie


加入: 2004/5月/22
Online Status: Offline
回復: 58
Posted: 2004/11月/16 12:44下午 | IP記錄 引用 koioggo

為你的網頁搜集圖像

在學習怎樣在你的網頁中加入圖像之前，你應該知道到哪兒去搜集圖像。通常有四種辦法：

僱用一個網頁設計公司來為你設計圖像，這可能會很貴，特別是為一個較大的網點設計圖像。對於專業級的圖像設計，你可能要為每幅圖 像支付50到100美元。網頁設計公司對於類似導航條、動畫、標誌這類圖像會收取更高的費用。對一個中型的網站，一般要支付50 00美元或更多。

如果你付得起，而且又能找到一個優秀的網頁設計公司，這是為你的網站設計圖像的最好辦法。再沒有比圖像更好的東西能吸引用戶對你 的網點加以注意。如果可能的話，多花些錢去設計漂亮的圖像，這會使你的網頁很不一般。

購買一些專門用於網站設計的圖像光盤。你可以根據你的需要修改或直接在你的網站上使用這些圖片，例如，Microsoft Visual Studio的光盤中包含了上百個圖片，你可以在你的網站中使用它們，而不用支付任何費用。

從環球網上的免費或商業圖像站點上下載圖片。一個較好的收集網頁圖片的商業站點是Photo Disc，地址是http://www.photodisc.com 。在下載圖片並在你的網頁中使用之前，你應獲得使用它們的許可權，未經過作者的同意而隨意從網頁上拷貝和使用別人的圖片是不合法 和另人討厭的。

通過一些作圖軟件自己為網頁製作一些圖片。即使你用上述的辦法獲得了一些圖片，你也可能要根據你的需要對這些圖片作一些修改。要 作到這一點，你需一些與網頁上使用的圖像格式相兼容的作圖軟件。

　

　

注意

你不能用Windows NT或Windows 95自帶的繪圖軟件來為你的網頁製作圖片。這個軟件即不支持GIF也不支持JPEG。第26章「使用Microsoft Image Composer」將教你怎樣使用Image Composer軟件（它是Microsoft Visual Studio的組件之一）來製作網頁圖片。如果你沒有Visual Studio，你可以使用共享軟件Paint Shop Pro（可在http://www.jasc.com下載）。另外，如果你想買一個高質量的作圖軟件，我推薦Adobe Photoshop或是Fractal Design Painter。
Back to Top 查看 koioggo's 資料 搜索其他貼子 koioggo 訪問 koioggo's
 

<< 上一頁 頁 of 3 下一頁 >>
  回復發表新主題
顯示可打印的頁面 顯示可打印的頁面

論壇跳轉
你 不能 張貼新論題在這個討論版
你 不能 回應論題在這個討論版
你 不能 刪除你的發言在這個討論版
你 不能 編輯你的發言在這個討論版
你 不能 新增投票標題在這個討論版
你 不能 在這個討論版投票

Edit by doreme Forums version 2004
Welcome ©2001-2004 doreme Guide

This page was generated in 0.8594 seconds.

　
保養品
保養品, Skin Care
www.elady.tw		 Makeups Wholesale
Wholesale Cosmetics SkinCares
lungjyi.com		 保養品批發
名牌保養品、保養品批發
www.perfume.com.tw/skincare		 Wholesale Perfumes
Fragrances Perfumes Wholesale
lungjyi.net