在坦洲網(wǎng)站建設(shè)的過程中，做網(wǎng)站代碼需要很專心的寫，一個代碼出錯，網(wǎng)站頁面很容易出現(xiàn)混亂。所以掌握做網(wǎng)站代碼攻略很重要。
第一章：HTML 語言的結(jié)構(gòu)
html文件是標(biāo)準(zhǔn)的ASCII文件，它看起來象是加入了許多被稱為標(biāo)注(tag)的特殊字符串的普遍文本文件。從結(jié)構(gòu)上講，html文件由元素(element)組成，組成html文件的元素有許多種，用于組織文件的內(nèi)容和指導(dǎo)文件的輸出格式。絕大多數(shù)元素是“容器”， 即它有起始標(biāo)記和結(jié)尾標(biāo)記。元素的起始標(biāo)記叫做起始標(biāo)注(start tag)，元素結(jié)束標(biāo)記叫做結(jié)尾標(biāo)注(end tag)，在起始標(biāo)注和結(jié)尾標(biāo)注中向的部分是元素體。 每一個元素都有名稱和可選擇的屬性，元素的名稱和屬性都在起始標(biāo)注內(nèi)標(biāo)明。
比如體元素(body)
<body backgroud＝"back-ground.gif"> <h2> demo </h2>
This is my first html file. <p>
</body>
第一行是體元素的起始標(biāo)注，它標(biāo)明體元素從此開始。因?yàn)樗械臉?biāo)注都具有相同的結(jié)構(gòu)，所以我們將仔細(xì)分析這個標(biāo)注的各個部分，以便讀者對標(biāo)注的寫法有一大概了解。
< 起始標(biāo)注開始
body 元素名稱，由于元素和標(biāo)注一一對應(yīng)，所以元素名也叫標(biāo)注名。需要注意的是<和body之間不能有空格。元素名稱不分大小寫。
background屬性名。一個元素可以有多個屬性，屬性及其屬性值不分大小寫。本屬性指明用什么方法來填充背景。
＝指明屬性值
“background.gif”屬性值，表示用background.gif文件來填充背景。
屬性名,＝,屬性值合起來構(gòu)成一個完整的屬性，一個元素可以有多個屬性，各個屬性用空格分開。
> 起始鏈接鏈結(jié)束。
第二行和第三行是body元素的元素體，最后一行是body元素的結(jié)尾標(biāo)注。結(jié)尾標(biāo)注用</開始，隨后是元素名，然后是大于號>。
從上面的例子中，我們可以看出，一個元素的元素體中可以有另外的元素。(上例中第二行的標(biāo)題元素<h2>„</h2>和第三行的分段元素<p>。實(shí)際上，html文件僅由一個html元素組成， 即文件以<html>開始，以</html>結(jié)尾，文件其部分都是 html的元素體。html元素的元素體由兩大部分，即頭元素<head>..</head>和體元素<body>„</body>和一些注釋組成。頭元素和體元素的元素體又由其它的元素和文本及注釋組成。也就是說，一個html文件應(yīng)具有下面的結(jié)構(gòu)：
<html> html文件開始
<head> 文件頭開始
文件頭
</head> 文件頭結(jié)束
<body> 文件體開始 文件體
</body> 文件體結(jié)束
</html> html文件結(jié)束
需要說明的是，html是一門發(fā)展很快的語言，早期的html文件并沒有如此嚴(yán)格的結(jié)構(gòu)，因而現(xiàn)在流行的瀏覽器(如Netscape,Mosaic等)為保持對早期html文件的兼容性,也支持不按上述結(jié)構(gòu)編寫的html文件。還需要說明的是，各種瀏覽器對html元素及其屬性的解釋也不完全一樣，本書中所講的元素，元素的屬性及其輸出是以Netscape2.0 瀏覽器為準(zhǔn)的，作者將盡量給出別的瀏覽器對某一元素的解釋。
一般來講，html的元素有下列三種表示方法： 1)<元素名>文件或超文本<／元素名>
2)<元素名 屬性名＝“屬性值„>文本成超文本<／元素名>
3)<元素名>
第三種寫法僅用于一些特殊的元素,比如分段元素P，它僅僅通知www瀏覽器在此處分段，因而不需要界定作用范圍， 所以它沒有結(jié)尾標(biāo)注。htlm3.0標(biāo)準(zhǔn)中，也定義了</p> 標(biāo)注，它用于需要界定作用范圍的段落，比如增加對齊方式屬性的段落。 注意: HTML并非大小寫敏感. <title> 和<TITLE>或者<TiTlE>是一樣的.
html文件中，有些元素只能出現(xiàn)在頭元素中，絕大多數(shù)元素只能出現(xiàn)在體元素中。在頭元素中的元素表示的是該html文件的一般信息，比如文件名稱，是否可檢索等等。這些元素書寫的次序是無關(guān)緊要的，它只表明該html有還是沒有該屬性。與此相反，出現(xiàn)在體元素中的元素是次序敏感的，改變元素在html文件中的次序會改變該html文件的輸出形式。
第二章： 構(gòu)成網(wǎng)頁的基本元素
2.1標(biāo)題(TITLE)
Title元素是文件頭中唯一一個必須出現(xiàn)的元素，它也只能出現(xiàn)在文件頭中。title元素的格式為：
<title>文件標(biāo)題</title>
title標(biāo)明該html文件的標(biāo)題，是對文件內(nèi)容的概括。一個好的標(biāo)題應(yīng)該能使讀者從中判斷出該文件的大概內(nèi)容。文件的標(biāo)題一般不會顯示在文本窗口中，而以窗口的名稱顯示出來。除了標(biāo)識窗口外，當(dāng)將某一 homepage 存入書簽或文件時，title還用作書簽名或缺省的文件名。
title的長度沒有限制，但過長的標(biāo)題會導(dǎo)致折行，一般情況下它的長度不應(yīng)超過64個字符。由于title的作用是標(biāo)明文件內(nèi)容，所以太短的title也是不可取的，比如：introduction 這個標(biāo)題，讀者不可能根據(jù)它判斷出本文介紹的是什么。一個好的例子是：
<title> An Introduction to HTML </title>
在頭元素中還可以出現(xiàn)其他元素，如<isindex>，<meta>等等。這些元素都不是必須的，而且也不常用。 這些元素的用法和它們的含義可以參考有關(guān)文獻(xiàn)。
下面是一個最簡單的html 文件
<html>
<title>the simplest html file</title>
This is my first html file.
</html>
§2.2 標(biāo)題(hn)
標(biāo)題元素有6種，分別為h1, h2,„h6，用于表示文章中的各種標(biāo)題。標(biāo)題號越小，字體越大。一般情況下，瀏覽器對標(biāo)題作如下解釋：
h1 黑體，特大字體，居中，上下各有兩行空行。
h2 黑體，大字體，上下各有一到兩行空行
h3 黑體(斜體)，大字體，左端微縮進(jìn)，上下空行
h4 黑體，普通字體，比h3更多縮進(jìn)，上邊一空行
h5 黑體(斜體)，與h4相同縮進(jìn)，上邊一空行
h6 黑體，與正文有相同縮進(jìn)，上邊一空行
Netscape 對hn的解釋為，一律黑體，字體越來越小。
hn可以有對齊屬性，align＝#， #表示
left標(biāo)題居左
center 標(biāo)題居中
right 標(biāo)題居右
例: <h2 align=center>Chapter 2 </h2>
<h1>標(biāo)題元素！</h1> 標(biāo)題元素！
<h2>標(biāo)題元素！</h2> 標(biāo)題元素！
<h3>標(biāo)題元素！</h3> 標(biāo)題元素！
<h4>標(biāo)題元素！</h4> 標(biāo)題元素！
<h5>標(biāo)題元素！</h5> 標(biāo)題元素！
<h6>標(biāo)題元素！</h6> 標(biāo)題元素！
§2.3 分段<P>
html的瀏覽器是基于窗口的，用戶可以隨時改變顯示區(qū)的大小，所以html將多個空格以及回車等效為一個空格，這是和絕大多數(shù)字處理器不同的。html的分段完全依賴于分段元素<P>。比如下面兩段源文件有相同的輸出。
<h2>This is a level Two Heading </h2>
paragraph one <p>paragraph two <p>
„ … … … … … … … … …
<h2>This Is a Level Two Heading</h2>
paragraph one <p>
paragraph Two <p>
<p>也可以有多種屬性，比較常用的屬性是： aligh＝#， #可以是left,center,right,其含義同上文。
例 <p align=center>This is a centered paragraph <／p>
當(dāng) html文件中有圖形，圖形可能占據(jù)了窗口的一端，圖形的周圍可能還有較大的空白區(qū)。這時，不帶clear屬性的<p>可能會使文章的內(nèi)容顯示在該空白區(qū)內(nèi)。為確保下一段內(nèi)容顯示在圖形的下方，可使用clear屬性。clear屬性的含義為：
clear=left 下一段顯示在左邊界處空白的區(qū)域 clear=right 下一段顯示在右邊界處空白的區(qū)域 clear=all 下一段的左右兩邊都不許有別的內(nèi)容
§2.4 列表List
列表用于列舉事實(shí)，常用的列表有3種格式，即無序列表(unordered List)，有序列表(ordered list)和定義列表(definition list)
2.4.1 無序列表(ul)
無序列表用(ul)開始，每一個列表?xiàng)l目用<li>引導(dǎo)，最后是</ul>，注意列表?xiàng)l目不需要結(jié)尾標(biāo)注</Li>。輸出時每一列表?xiàng)l目縮進(jìn)，并且以黑點(diǎn)標(biāo)示。
例 ：
<ul>
<li>Today
<li>Tommorow
</ul>
輸出為
●Today
●Tommorow
2.4.2 有序列表<ol>
有序列表與無序列表相比，只是在輸出時列表?xiàng)l目用數(shù)字標(biāo)示，下面是一個例子及其輸出：
例：
<ol>
<li>Today
<li>Tommorow
</ol>
輸出為：
1.Today
2.Tommorow
2.4.3 定義列表<dl>
定義列表用于對列表?xiàng)l目進(jìn)行簡短說明的場合，用<dl>開始，列表?xiàng)l目用<dt>引導(dǎo)，列表?xiàng)l目的說明用<dd>引導(dǎo)。
<dl>
<dt>Item 1
<dd>The definition of item 1
<dt>Item 2
<dd>Definition or explaination of item 2
</dl>
輸出為：
Item 1
The definition of item 1
Item 2
Definiton or explaination of item 2
2.4.4 改變條目標(biāo)記
1.改變無序列表?xiàng)l目標(biāo)記
無序列表輸出時，每一條目前都有一個黑色圓點(diǎn)，用戶可以用type序性修改條目的標(biāo)記。type可以是disc 實(shí)心圓點(diǎn) cirde圓圈 square實(shí)心方點(diǎn)
<ul>
<li type=disc>ONE
<li type=circle>TWO
<li type=square>THREE
</ul>
輸出為：
●ONE
○TWO
■THREE
2.改變有序列表?xiàng)l目標(biāo)記
有序列表?xiàng)l目標(biāo)記的缺省值是阿拉伯?dāng)?shù)字，可以用type屬性修改。方法為：
<li type=#>
Li= A, 大寫字母
a, 小寫字母
I, 大寫羅馬數(shù)字
i, 小寫羅馬數(shù)字
l, 缺省,阿拉伯?dāng)?shù)字
<ol><li type=A>ONE-ONE
<li>ONE-TWO</ol>
輸出為：
A.ONE-ONE
B.ONE-TWO
<ol><li type=a>ONE-ONE
<li>ONE－TWO</ol>
輸出為：
a.ONE-ONE
b.ONE-TWO
<ol><li type=I>ONE-ONE
<li>ONE=TWO<／ol>
輸出為：
Ⅰ.ONE-ONE
Ⅱ.ONE-TWO
<ol><li type=i>ONE-ONE
<li>ONE-TWO<／ol>
輸出為：
i.ONE-ONE
ii.ONE-TWO
<ol><li type=1>ONE-ONE
<li>ONE-TWO</ol>
輸出為：
1.ONE-ONE
2.ONE-TWO
3.改變有序列表?xiàng)l目的起始數(shù)字
有序列表的條目數(shù)字在缺省情況下是從1開始的，用start屬性可修改這一值。方法為<ol start=#> #是條目起始號
<ol start=5>
<li type=A>ONE-ONE
<li>ONE-TWO
<ol start=10>
<li>TWO-ONE
<li type=i>TWO-ONE
</ol></ol>
輸出為：
E.ONE-ONE
F.ONE-TWO
10.TWO-ONE
xi.TWO-TWO
2.4.5 列表的嵌套
各種列表可以相互嵌套，每一個列表?xiàng)l目都可以是一個單獨(dú)的列表。每嵌套一層，列表?xiàng)l目的輸出就會有更大的縮進(jìn)。請參照上面的例子。
§2.5 預(yù)格式化文本<pre>
html的輸出是基于窗口的，因而html文件在輸出時都是要重新格式化的，若確實(shí)不需要重新格式化的內(nèi)容，可以用<pre>„<／pre>通知瀏覽器。瀏覽器在輸出時，對這部分內(nèi)容幾乎不做修改地輸出，輸出的字體電傳打字機(jī)字體。早期的html規(guī)范規(guī)定在預(yù)格式化區(qū)內(nèi)不能出現(xiàn)格式化輸出的元素。如hn等，Netscape在遇到預(yù)格式化元素時，允許其中有其他元素。
<pre>
please use your card.
VISA Master
<b>Here is an order form.</b>
<ul><li>Fax
<li>Air Mail </ul>
</pre>
輸出為：
please use your card
VISA Master
Here is an order form.
●Fax
●Air Mail
§2.6 塊引用<BLOCKQUOTE>
塊引用用<BLOCKQUOTE>標(biāo)注，使屏幕顯示單獨(dú)的一塊。大多數(shù)的瀏覽器采用縮進(jìn)編排的方式，使這一塊和其他部分的文本區(qū)分開來，上下各有一空行。
塊引用(Blockquote) <blockquote>...</blockquote> Her Song: <blockquote>
When I was young, I listened to the radio waiting for my favorite songs.... </blockquote> Her Song:
When I was young, I listened to the radio waiting for my favorite songs....
§2.7 居中
很多元素都有對齊方式屬性，如hn 、p等。也可以直接用居中標(biāo)注<center>„<／center>
<h3 align=center>Wonderful!!</h3>
<center>This must be my dream.</center>
輸出為：
Wonderful!!
This must be my dream.
第三章：超文本鏈接指針
超文本鏈接指針是html最吸引人們優(yōu)點(diǎn)之一。鏈接指針可以使讀者在整個Internet網(wǎng)上方便地鏈接。使用超文本鏈接指針可以使順序存放的文件具有一定程度上隨機(jī)訪問的能力，而每一個鏈接指針正好代表了作者或者讀者的思維跳躍，這更加符合人類的思維方式。因而組織得好的鏈接指針有助于理解作者的意圖。
一個超文本鏈接指針由兩部分組成。一是被指向的目標(biāo)，它可以是同一文件的另一部分，也可以是世界另一端的一個文件，還可以是動畫或音樂；另一部分是指向目標(biāo)的鏈接指針。
§3.1 統(tǒng)一資源定位器URL
統(tǒng)一資源定位器(uuiform Resource Locator)是文件名的擴(kuò)展。在單機(jī)系統(tǒng)中，定位一個文件需要路徑和文件名，對于遍布全球的Internet網(wǎng)，顯然還需要知道文件存放在哪個網(wǎng)絡(luò)的哪臺主機(jī)中才行。與單機(jī)系統(tǒng)不一樣的是在單機(jī)系統(tǒng)中，所有的文件都由統(tǒng)一的操作系統(tǒng)管理，因而不必給出訪問該文件的方法；而在Internet上，各個網(wǎng)絡(luò)，各臺主機(jī)的操作系統(tǒng)都不一樣，因此必須指定訪問該文件的方法。一個URL包括了以上所有的信息。它的構(gòu)成為：
protocol:// machine.name[:port]／directory/filename
其中protocol是訪問該資源所采用的協(xié)議，即訪問該資源的方法，它可以是： http 超文本傳輸協(xié)議，該資源是html文件file 文件傳輸協(xié)議,用ftp訪問該資源ftp 文件傳輸協(xié)議,用ftp訪問該資源gopher gopher協(xié)議,該資源是gopher文件news 表明該資源是網(wǎng)絡(luò)新聞
madcine.name 是存放該資源主機(jī)的IP 地址,通常以字符形式出現(xiàn),如 sun.ihep.ac.cn port端口號，是服務(wù)器在該主機(jī)所使用的端口號。一般情況下端口號不需要指定。只有當(dāng)服務(wù)器所使用的端口號不是缺省的端口號時才指定。directory和filename是該資源的路徑和文件名。
§3.2 指向一個目標(biāo)<a>
在html文件中用鏈接指針指向一個目標(biāo)。其基本格式為：
<a href="/url">字符串
href屬性中的統(tǒng)一資源定位器(url)是被指向的目標(biāo)，隨后的“字符串”在html文件中充當(dāng)指針的角色， 它一般顯示為藍(lán)色。當(dāng)讀者用鼠標(biāo)點(diǎn)這個字符串時，瀏覽器就會將url處的資源顯示在屏幕上。例如：
IHEP CHINA homepage
用戶用鼠標(biāo)點(diǎn)取IHEP china homepage，即可看到高能所編寫的關(guān)于中國情況的介紹。在這個例子中， 充當(dāng)指針的是IHEP china homepage，下面我們將看到用圖象做為指針的例子。
在編寫html文件時，需要知道目標(biāo)的url。如何才能得到目標(biāo)的url呢？對于自己主機(jī)內(nèi)的文件，它的url 可以根據(jù)該文件的實(shí)際情況決定。對于Interner上的資源， 我們在用瀏覽器觀看時，它的url會在瀏覽器的Location一欄中顯示出來，把它抄下來寫到你的html文件中即可。
在編寫html文件時，對有能確定關(guān)系的一組資源(比如在同一個目錄中)應(yīng)采用相對url，這不僅簡化你的html文件，而且便于維護(hù)。比如當(dāng)你需要將某個目錄整個搬到另外一個地方或把某一主機(jī)的資源移到另一臺主機(jī)時，用相對url寫的html文件用不看更新其中的url(只要它們的相對關(guān)系沒有改變)。但如果你用絕對url編寫html，你就不得不逐字修改每個鏈接指針中的url，這是一件很乏味也很容易出錯的工作。對于各個資源之間沒有固定的關(guān)系，比如你的html文件是介紹各大學(xué)情況的，它所指向的目標(biāo)分布在全球的主機(jī)中，這時你就只能用絕對url了。
在本章的末尾，作者給出一個完整的html文件，該文件使用了前三章介紹的全部元素，以便于讀者理解。 §3.3 標(biāo)記一個書簽
上節(jié)提到的鏈接指針可以使讀者在整個Interner網(wǎng)上方便地鏈接。但如果你編寫了一個很長的html文件，從頭到尾地讀很浪費(fèi)時間，能不能在同一文件的不同部分之間也建立起鏈接，使用戶方便地在上下方之間跳轉(zhuǎn)呢？答案是肯定的。前面曾提到過一個超文本鏈接指針包括兩個部分，一個指向目標(biāo)的鏈接指針，另一個是被指向的目標(biāo)。對于一個完整的文件，我們可以用它的url來唯一地標(biāo)識它， 但對于同一文件的不同部分，我們怎樣來標(biāo)識呢？下面的內(nèi)容將介紹鏈接指針元素的另外的一個用途，標(biāo)識書簽。
標(biāo)識一個書簽的方法為：
<a name="name">text<／a>
name屬性將放置該標(biāo)記的地方標(biāo)記為“name”，name是一個全文唯一的標(biāo)記串，text部分可有可無。這樣，我們就把放置標(biāo)記的地方做了一個叫做“name”的標(biāo)記。 做好標(biāo)記后，可以用下列方法來指向它，
<a href="url#name">text
url是放置標(biāo)記的html文件的url name是標(biāo)記名，對于同一個文件，可以寫為
<a href="#name">text
這時就可以點(diǎn)取text跳轉(zhuǎn)到標(biāo)記名為name的部分了。 §3.4 目標(biāo)窗口
如果希望被指向的目標(biāo)在一個新的窗口中顯示，可以使用target屬性來修飾鏈接指針元素。
<a href="/url" target="window-name">text
將url代表的資源顯示在一個新的窗口中，該窗口的名字叫window-name。
§3.5 圖象鏈接指針
圖象也可以做為鏈接指針。格式為：
<a href="/url"><img src="/url">
可以看出，上例中用<img src="/url">取代了鏈接指針中text的位置。
<img src="/url">是圖象元素，它表明顯示url代表的圖象文件，參見圖象一章。
下面是一個簡單的圖象鏈接指針:
<a href="/www.ihep.ac.cn">China home page<img src="flag.gif">
邊框 <img border=#> #=value
<a href="/URL">
<img src="/URL" border=15>
§3.6 圖象地圖(image map)
上一節(jié)介紹的圖象鏈接指針每幅圖只能指向一個地點(diǎn)，而圖象地圖可以把圖象分成多個區(qū)域，每個區(qū)域指向不同的地點(diǎn)。你可以用圖象地圖編出很漂亮的html文件。
使用圖象地圖稍微復(fù)雜一點(diǎn)。圖象地圖不僅需要在html文件中說明，它還需要一個后綴為.map的文件，用來說明圖象分區(qū)及其指向的url的信息。 在.map文件中說明分區(qū)信息的格式如下：
rect url 左上角坐標(biāo)，右下角坐標(biāo)
poly url 各頂點(diǎn)坐標(biāo)
circle url 直徑兩端點(diǎn)坐標(biāo)
default url
rect指定一個矩形區(qū)域，該區(qū)域的位置由左上角坐標(biāo)和右下角坐標(biāo)說明。poly 指定一多邊形區(qū)域，該區(qū)域的位置由各頂點(diǎn)坐標(biāo)說明。circle 指定一圓形區(qū)域，該區(qū)
域的位置由垂直通過圓心的直徑與該圓的交點(diǎn)坐標(biāo)說明。default 指定圖象地圖其它部分的url。坐標(biāo)的寫法為：x,y ，各點(diǎn)坐標(biāo)之間用空格分開。下面是一個完整的說明文件，
default http://www.ihep.ac.cn
rect http://www.ibm.com 140,20 280,60
poly http://www.microsoft.com 180,80 200,140 circle http://www.yahoo.com 80,140 80,100
圖象地圖需要一個特殊的處理程序 imagemap，imagemap放在/cgi-bin 中。在html 文件中引用圖象地圖的 格式為：
<a href="/cgi-bin/imagemap/mymap.map">
<img src="mymap.gif" ismap>
可以看出這是一個包含圖象元素的鏈接指針元素。圖象元素指明用于圖象地圖的圖象的url，并用Ismap屬性說明。需要說明的是鏈接指針中的href屬性，它由兩部分組成，第一部分是/cgi-bin/imagemap ，它指出用哪個程序來處理圖象地圖，它必須原樣寫入，第二部分才是圖形地圖的說明文件mymap.map。/cgi-bin/imagemap/mymap.map絕不表示mymap.map在/cgi-bin/imagemap目錄中。在netscape擴(kuò)展中，圖象地圖可以用一種比較簡化的方式來表示，這就是客戶端圖象地圖。用戶端地圖可以將圖象地圖的說明文件寫在html文件中，而且不需要另外的程序來處理。這就使html作者可以用同別的元素相一致的寫法來寫圖象地圖。 客戶端圖象地圖還有一個優(yōu)點(diǎn)，當(dāng)鼠標(biāo)指向圖象地圖的不同區(qū)域時，瀏覽器能顯示出各個區(qū)域所指向的url。但目前只有netscape2.0以上版本才支持這一擴(kuò)展。
用戶端圖象地圖的格式為：
<img src="/url" usemap="#mymap">
src="/url" 指定用作圖象地圖的圖象
usemap屬性指明這是客戶端圖象地圖
"#mymap"是圖象文件說明部分的標(biāo)記名，瀏覽器尋找名字為mymap的<map>元素并從中得到圖象地圖的分區(qū)信息?？蛻舳藞D象地圖的分區(qū)信息用<map name=mapname>元素說明，name屬性命名<map>元素。圖象地圖的各個區(qū)域用<area shape="形狀" coords="坐標(biāo)" href="/url">說明，形狀可以是：rect矩形，用左上角，右下角的坐標(biāo)表示，各個坐標(biāo)值之間用逗號分開； poly多邊形，用各頂點(diǎn)的坐標(biāo)值表示；circle圓形，用圓心及半徑表示，前兩個參數(shù)分別為圓心的橫、縱坐標(biāo)， 第三個參數(shù)為半徑。 href="/url"，表示該區(qū)域所指向的 資源的url，也可以是nohref，表示在該區(qū)域鼠標(biāo)點(diǎn)取無效?？蛻舳藞D象地圖各個區(qū)域可以重疊，重疊區(qū)以先說明的條目為準(zhǔn)，下面是一個例子：
源程序：
<img src="mapimg.gif" usemap="#Face>
<map name="Face">
<!Text BOTTON> 此行是注釋
<area shape="rect"
href="page.html"
coords="140,20,280,60">
<!Triangle BOTTON>
<area shape="poly"
href="/image.html"
coords="100,100,180,80,200,140">
<!FACE>
<area shape="circle"
href="/nes.html"
coords="80,100,60>
</map>
第四章： 版面風(fēng)格控制
§4.1 字體大小
html有七種字號，1號最小，7號最大。缺省字號為3，可以用<basefontsize=字號>設(shè)置缺省字號。
設(shè)置文本的字號有兩種辦法，一種是設(shè)置絕對字號，；另一種是設(shè)置文本的相對字號；。用第二種方法時“＋”號表示字體變大，“－”號表示字體變小。
字體大小 字體大小
字體大小 字體大小
字體大小 字體大小
字體大小 字體大小
字體大小 字體大小
字體大小 字體大小
字體大小 字體大小
§4.1.2 字體風(fēng)格
字體風(fēng)格分為物理風(fēng)格和邏輯風(fēng)格。
物理風(fēng)格直接指定字體，物理風(fēng)格的字體有：<b>黑體，<i>斜體，<u>下劃線，<tt>打字機(jī)體。
邏輯風(fēng)格指定文本的作用：<em>強(qiáng)調(diào) <srrony>特別強(qiáng)調(diào) <code>源代碼<samp>例子 <kbd>鍵盤輸入 <var>變量 <dfn>定義 <cite>引用 <small>較小<big>較大 <sup>上標(biāo) <sup>下標(biāo)
物理風(fēng)格(Physical Style):
<b>今天天氣真好！</b> 今天天氣真好！
<i>今天天氣真好！</i> 今天天氣真好！
<u>今天天氣真好！</u> 今天天氣真好！
<tt>今天天氣真好！</tt> 今天天氣真好！
<sup>今天天氣真好！</sup> 今天天氣真好！
<sub>今天天氣真好！</sub> 今天天氣真好！
<s>今天天氣真好！</s> 今天天氣真好！
<strike>今天天氣真好！</strike> 今天天氣真好！
邏輯風(fēng)格(Logical Style):
<em>今天天氣真好！</em> 今天天氣真好！
<strong>今天天氣真好！</strong> 今天天氣真好！
<code>今天天氣真好！</code> 今天天氣真好！
<samp>今天天氣真好！</samp> 今天天氣真好！
<kbd>今天天氣真好！</kbd> 今天天氣真好！
<var>今天天氣真好！</var> 今天天氣真好！
<dfn>今天天氣真好！</dfn> 今天天氣真好！
<cite>今天天氣真好！</cite> 今天天氣真好！
<small>今天天氣真好！</small> 今天天氣真好！
<big>今天天氣真好！</big> 今天天氣真好！ §4.1.3 字體顏色
字體的顏色用...指定
xxxxxx可以是6位16進(jìn)數(shù)，分別指定紅、綠、蘭的值，也可以是black，olive，teal，red，blue，maroon，navy，gray，lime，fudrsia，white，green，purple，sliver，yellow，aqua 之一。
字體風(fēng)格
字體風(fēng)格
§4.1.4 閃爍
<blink>文本</blink>使文本閃爍，閃爍頻率為１秒鐘一次。
§4.2 標(biāo)尺線(hr)
標(biāo)尺線，一般用于分隔同一文體的不同部分。在窗口中劃一條標(biāo)尺線非常簡單，只要寫一個<hr>即可。標(biāo)尺線的寬度用<hr size=n>指定，width=#>指n是線寬，單位是象素。例：<hr size=10>。 <hr 定標(biāo)尺線長度，可以指定絕對線長，也可以指定標(biāo)尺線長度占窗口寬度的百分比。例<hr width=50> 、<hr width=50%>。
標(biāo)尺線的位置用<hr align=#>指定。
#是left成right之一，left表示左端與左邊界對齊，right是右端與右邊界對齊，缺省，標(biāo)尺線出現(xiàn)在窗口正中。
<hr>
--------------------------------------------------------------------------------
<hr size=10>
--------------------------------------------------------------------------------
<hr width=50>
--------------------------------------------------------------------------------
<hr width=50%>
--------------------------------------------------------------------------------
<hr width=50% align=left>
--------------------------------------------------------------------------------
<hr width=50% align=right>
--------------------------------------------------------------------------------
<hr noshade>
--------------------------------------------------------------------------------
<hr color=#>
#=rrggbb 16 進(jìn)制 RGB 數(shù)碼，或者是下列預(yù)定義色彩： Black, Olive, Teal, Red, Blue, Maroon, Navy, Gray, Lime, Fuchsia, White, Green, Purple, Silver, Yellow, Aqua
4.3 行間圖象
行向圖象使你的頁面更加漂亮，但是行向圖象會導(dǎo)致網(wǎng)絡(luò)通訊量急劇增大。使訪問時間延長。所以在主頁(homepage)，不宜采用很大的圖象。如果確實(shí)需要一些大圖象，最好在主頁中用一個縮小的圖象指向原圖，并標(biāo)明該圖的大小。這樣讀者可以快速地訪問您的主頁，自己選擇看還是不看那些圖象。
圖象的基本格式為：
<img src="/image-url">或<img src="/image-urd" alt="text">image-url是圖象文件的url。目前，大部分瀏覽器支持 .gif 和 .xbm文件，netscape還支持jpeg文件。alt屬性告訴不支持圖象的瀏覽器用text代替該圖。
4.3.2 圖象與文本的對齊方式
圖象在窗口中會占據(jù)一塊空間，在圖象的左右可能會有空白，不加說明時，瀏覽器將隨后的文本顯示在這些空白中，顯示的位置由align屬性指定。
<img src="/URL" align=top> My face!
My Face!
<img src="/URL" align=middle> My face!
My Face! <img src="/URL" align=bottom> My face！
My Face!
4.3.3 圖象在頁面中的對齊方式／布局（Floating Image)
<img align=left>
<img src="/URL" align=left>My Face!<br>
It is always<br>
smiling.<br>
Hahaha....<br>
My Face!
It is always smiling.
Hahaha....
<img align=right>
My Face!
It is always
smiling.
Hahaha....
<br clear=all>
<img src="/URL" align=left>My Face!<br>
It is always <br clear=all>
smiling.<br>
Hahaha....<br>
My Face!
It is always
smiling.
Hahaha....
<img vspace=# hspace=#> #=value
<img src="/URL" align=left vspace=10 hspace=20>My Face!<br>
It is always<br>
smiling.<br>
Hahaha....<br>
My Face!
It is always smiling.
Hahaha....
4.4 分行<BR>和禁止分行<nobr>
<Br>表示在此處分行，<nobr>....</nobr>叫通知瀏覽器，其中的內(nèi)容在一行內(nèi)顯示，若一行內(nèi)顯示不了，則超出部分被裁剪掉。
<br clear=#>clear屬性標(biāo)明下一行的情況，如clear=left，表示下一行從左邊界處開始。#可以是left，right，all之一。例:
§4.5 背影和文本顏色
窗口背景可以用下列方法指定
<body background="/image-url">
<body bgcolor=# text=# link=# alink=# vlink=#>
前者指定填充背景的圖象，如果圖象的大小小于窗口大小，則把背景圖象重復(fù)，直到填滿窗口區(qū)域。
后者指定的是16進(jìn)制的紅、綠、蘭分量。
bgcolor 背景顏色
Text 文本顏色
Link 鏈接指針顏色
alinik 活動的鏈接指針顏色
vlinik 已訪問過的鏈接指針顏色
例 <body bgcolor=FFoooo>大紅背景色.
注意，此時體元素必須寫完整，即用<body>結(jié)束 4.6 轉(zhuǎn)義字符與特殊字符
html中< ， >，&有特殊含義，(前兩個字符用于標(biāo)注，&用于轉(zhuǎn)義)，不能直接使用。使用這三個字符時，應(yīng)使用它們的轉(zhuǎn)義序列。
& 的轉(zhuǎn)義序列為 & amps 或 & #38；
< 的轉(zhuǎn)義序列為 & Lt; & #60；
> 的轉(zhuǎn)義序列為 & gt; & #62；
前者為字符轉(zhuǎn)義序列，后者為數(shù)字轉(zhuǎn)義序列。
例如 & Lt; font &Lgt;顯示為<font>若直接寫為<font>則被認(rèn)為是一個標(biāo)注。
需要說明的是：
a. 轉(zhuǎn)義序列各字符間不能有空格；
b. 轉(zhuǎn)義序列必須以“；”結(jié)束；
c. 單獨(dú)的&不被認(rèn)為是轉(zhuǎn)義開始。
如“ & Lt； ”被解釋為 “& Lt；”而不是<“&# 62 ；”被解釋為 “& # 60；”而不是>另一個需要轉(zhuǎn)義的字符是引號，它的轉(zhuǎn)義序列為"""或"""，例如<img src="/image.gif"alt="A &quol; real " example">。html使用的字符集是ISO &859 Larin-1字符集，該字符集中有許多標(biāo)準(zhǔn)鍵盤上無法輸入的字符。對這些特殊字符只能使用轉(zhuǎn)義序列。
第五章：表格(Table)
§5.1 表格的基本形式
一個表由<table>開始，</table>結(jié)束，表的內(nèi)容由<tr>,<th>和<td>定義。<tr>說明表的一個行，表有多少行就有多少個<tr>；<th>說明表的列數(shù)和相應(yīng)欄目的名稱，有多少個欄就有多少個<th>；<td>則填充由<tr>和<th>組成的表格。是否用表格線分開為部分內(nèi)容用border屬性說明，下面是一個有表格線和一個元表格線的表及其輸出。
帶邊框的表格：
<table border>
<tr><th>Food</th><th>Drink</th><th>Sweet</th> <tr><td>A</td><td>B</td><td>C</td>
</table>
Food Drink Sweet
A B C
不帶邊框的表格：
<table>
<tr><th>Food</th><th>Drink</th><th>Sweet</th>
<tr><td>A</td><td>B</td><td>C</td>
</table>
Food Drink Sweet
A B C
5.2 有通欄的表
1、有橫向通欄的表用<th colspan=#>屬性說明：colspan表示橫向欄距，#代表通欄占據(jù)的網(wǎng)格數(shù)，它是一個小于表的橫向網(wǎng)格數(shù)的整數(shù)。
跨多列的表元 <th colspan=#>
<table border>
<tr><th colspan=3> Morning Menu</th>
<tr><th>Food</th> <th>Drink</th> <th>Sweet</th> <tr><td>A</td><td>B</td><td>C</td>
</table>
Morning Menu
Food Drink Sweet
A B C
2、有縱向通欄的表用rowspan=#屬性說明：rowspan表示縱向欄距，#表示通欄占據(jù)的網(wǎng)格數(shù)，應(yīng)小于縱向網(wǎng)絡(luò)數(shù)。需要說明的是有縱向通欄的表，每一行必須用</tr>明確給出一橫向欄目結(jié)束,這是和表的基本形式不同的。
跨多行的表元
<th rowspan=#>
<table border>
<tr><th rowspan=3> Morning Menu</th> <th>Food</th> <td>A</td></tr>
<tr><th>Drink</th> <td>B</td></tr> <tr><th>Sweet</th> <td>C</td></tr>
</table>
Morning Menu Food A
Drink B
Sweet C
5.3 表格屬性
1、表的大小用width=#和height=#屬性說明。前者為表寬，后者為表高，#是以象素為單位的整數(shù)。
<table border width=# height=#>
表格尺寸設(shè)置：
<table border width=170 height=100>
<tr><th>Food</th><th>Drink</th><th>Sweet</th> <tr><td>A</td><td>B</td><td>C</td>
</table>
Food Drink Sweet
A B C
2、邊框?qū)挾扔蒪order=#說明，#為寬度值，單位是象素。
<table border=#>
邊框尺寸設(shè)置：
<table border=10>
<tr><th>Food</th><th>Drink</th><th>Sweet</th> <tr><td>A</td><td>B</td><td>C</td>
</table>
Food Drink Sweet
A B C
3、表格間距即劃分表格的線的粗細(xì)用cellspacing=#表示，#的單位是象素，下面的例子將表格間距定義為10個象素，它看起來象用很粗的線劃分的表格。
<table border cellspacing=#>
表元間隙設(shè)置：
<table border cellspacing=10>
<tr><th>Food</th><th>Drink</th><th>Sweet</th> <tr><td>A</td><td>B</td><td>C</td>
</table>
Food Drink Sweet
A B C
5.4 表中文本的輸出
1、文本與表框的距離用cellpadding=#說明。下面的例子使表的內(nèi)容與表框離開10個象素。
<table border cellpadding=#>
表元內(nèi)部空白設(shè)置：
<table border cellpadding=10>
<tr><th>Food</th><th>Drink</th><th>Sweet</th> <tr><td>A</td><td>B</td><td>C</td>
</table>
Food Drink Sweet
A B C
2、表格的后度大于其中的文本后度時，文本在其中的輸出位置用align=#說明。#是 left，center和right三者之一，分別表示左對齊，居中和右對齊，align屬性可修飾<tr>,<th>和<td>標(biāo)注。
<tr align=#>
<th align=#> #=left, center, right
<td align=#>
<table border width=160>
<tr>
<th>Food</th><th>Drink</th><th>Sweet</th>
<tr>
<td align=left>A</td>
<td align=center>B</td>
<td align=right>C</td>
</table>
Food Drink Sweet
A B C
3、表格的高度大于其中文本的高度時，可以用valign=#說明文本在其中的位置。#是top,middle,bottom,baseline四者之一。分別表示上對齊，文本中線與表格中線對齊， 下對齊，文本基線與表格中線對齊，特別注意的是baseine對齊方式，它使得文本出現(xiàn)在網(wǎng)格的上方而不是相象中的下半部。同樣，valign可以修飾<tr>,<th>,<td>中的任何一個。
<tr valign=#>
<th valign=#> #=top, middle, bottom, baseline <td valign=#>
<table border height=100>
<tr>
<th>Food</th><th>Drink</th> <th>Sweet</th><th>Other</th>
<tr>
<td valign=top>A</td>
<td valign=middle>B</td>
<td valign=bottom>C</td>
<td valign=baseline>D</td>
</table>
Food Drink Sweet Other
A B C D
5.5 浮動表格
所謂浮動表格是指表與文件中重中內(nèi)容對齊時，若在現(xiàn)在位置上不能滿足其對齊方式，表格含上下移動，即“擠開”一些內(nèi)容，直到滿足其對齊要求。
浮動屬性一般由align=left或right指定。
下面的例子也可以看出，cllign=left時把字符串“擠到”了表的右邊。當(dāng)右邊空間不夠時，該字符串會顯示在表的下在邊，看起來象是表“浮”到了字符串上。 <table align=left>
<table align="left" border>
<tr><th>Food</th><th>Drink</th><th>Sweet</th> <tr><td>A</td><td>B</td><td>C</td>
</table>
My favorites...<br>
cookies, chocolates, and more.
Food Drink Sweet
A B C
My favorites...
cookies, chocolates, and more.
<table align=right>
Food Drink Sweet
A B C
5.6 表格顏色
表格的顏色用bgcolor=#指定。
#是16進(jìn)制的6位數(shù)，格式為rrggbb，分別表示紅、綠、蘭三色的分量。或者是16種已定義好的顏色名稱，參見文本顏色。
<table border>
<tr><th bgcolor=000000>
Food</th>
<th bgcolor=whit>Drink</th>
<tr><td bgclor=ffaaaa>A</td><td>B</td> </table> Food Drink
A B
第六章：幀結(jié)構(gòu) Frame
6 .1 幀結(jié)構(gòu)的基本格式
幀結(jié)構(gòu)將流覽器的窗口分成多個區(qū)域，每個區(qū)域可以單獨(dú)顯示一個html文件，各個區(qū)域也可相關(guān)連地顯示某一個內(nèi)容，比如可以將索引放在一個區(qū)域，文件內(nèi)容顯示在另一個區(qū)域。 幀結(jié)構(gòu)的基本結(jié)構(gòu)如下
<html>
<head>
<title>...</title>
</head>
<noframes>...</noframes>
<frameset>
<frame src="/url">
</frameset>
</html>
<noframes>...</noframes>中的內(nèi)容顯示在不支持幀結(jié)構(gòu)的瀏覽器窗口中,因而這里指向一個普通版本的html文件，以便使用不支持幀結(jié)構(gòu)瀏覽器的用戶閱讀。
幀結(jié)構(gòu)由<frameset>指定，并且可以嵌簽，分區(qū)中種部分顯示的內(nèi)容用<framre>指定。 可以將窗口橫向分成幾個部分，也可以分成縱向幾個部分，還可以混和幀結(jié)構(gòu)。
6.2 橫向幀結(jié)構(gòu)
橫向幀結(jié)構(gòu)用<frameser rows=#>指定，#可以是一個百分?jǐn)?shù)，也可以是一整數(shù)。前者規(guī)定各幀占窗口的百分?jǐn)?shù)，后者指定各幀的絕對大小。例如，下面的例子將窗口分成30%、20%、50%的幾個區(qū)域，各區(qū)域的內(nèi)容分別為A.html,B.html,C.html. <frameset rows=#>
橫向排列多個窗口：
<frameset rows=25%,25%,50%>
<frame src="/A.html">
<frame src="/B.html">
<frame src="/C.html">
</frameset>
A
B
C
6.3 縱向幀結(jié)構(gòu)
縱向幀結(jié)構(gòu)用<frameset cols=#>指定，參見下例： <frameset cols=#>
縱向排列多個窗口：
<frameset cols=30%,20%,50%>
<frame src="/A.html">
<frame src="/B.html">
<frame src="/C.html">
</frameset>
A B C
6.4 混合幀結(jié)構(gòu)
將窗口分成橫縱幾個區(qū)域時，用<frameset>代替<frame>鏈接至即可將原的分好的<frame>區(qū)域再次幀結(jié)構(gòu)， 下面的例子先將窗口分成20%,80%， 然后將右邊的區(qū)域再分成分別占40%和60%的上下兩個區(qū)域。 縱橫排列多個窗口：
<frameset cols=20%,*>
<frame src="/A.html">
<frameset rows=40%,*>
<frame src="/B.html">
<frame src="/C.html">
</frameset>
</frameset>
A B
C
6.5 幀結(jié)構(gòu)與幀中文本的間距
幀結(jié)構(gòu)與其中的文本間距可以用Marginwidth=#和marginneigh=#來指定，前者指定文本與幀結(jié)構(gòu)的邊緣的橫向距離，后者為縱向距離，其單位都為象素，下面的例子中，將右邊幀結(jié)構(gòu)的左右邊距，上下空白都設(shè)為50個象素。
6.6 幀結(jié)構(gòu)間的關(guān)聯(lián)
幀結(jié)構(gòu)之間可以有特定的關(guān)聯(lián)，比如將某一幀的內(nèi)容輸出到另一個幀，這樣我們就可以把其中一個幀作為輸出幀，另一個幀作為選擇幀。實(shí)現(xiàn)這種關(guān)聯(lián)需要做下列的事情。
①在幀結(jié)構(gòu)的hrme文件中標(biāo)記各個幀，標(biāo)記的方法是在<frame>中加入name屬性，比如上例，定義左邊的幀為輸出，右邊幀為主幀。
<frame src="/A.html"name=display>
<frame src="/B.htme"name=index>
②在B.html文件中指定輸出到哪個幀方法是在B.html文件中加入下列一行。
<base target="display">
這便得用鼠標(biāo)點(diǎn)取B.html中的鏈接指針，它的輸出會顯示在左邊的幀中。
特殊的 4 類操作(很有用喔)
<a href="/url" target=_blank> 新窗口
<a href="/url" target=_self> 本窗口
<a href="/url" target=_parent> 父窗口
<a href="/url" target=_top> 整個瀏覽器窗口
1. oncontextmenu="window.event.returnvalue=false" 將徹底屏蔽鼠標(biāo)右鍵
<table border oncontextmenu=return(false)><td>no</table> 可用于Table
2. <body onselectstart="return false"> 取消選取、防止復(fù)制
3. onpaste="return false" 不準(zhǔn)粘貼
4. oncopy="return false;" oncut="return false;" 防止復(fù)制
5. <link rel="Shortcut Icon" href="favicon.ico"> IE地址欄前換成自己的圖標(biāo)
6. <link rel="Bookmark" href="favicon.ico"> 可以在收藏夾中顯示出你的圖標(biāo)
7. <input style="ime-mode:disabled"> 關(guān)閉輸入法 8. 永遠(yuǎn)都會帶著框架
<script language="javascript"><!--
if (window == top)top.location.href = "frames.htm"; //frames.htm為框架網(wǎng)頁 // --></script>
9. 防止被人frame
<SCRIPT LANGUAGE=javascript><!--
if (top.location != self.location)top.location=self.location; // --></SCRIPT>
10. <noscript><iframe src="/*.html>";</iframe></noscript> 網(wǎng)頁將不能被另存為
11. <input type=button value=查看網(wǎng)頁源代碼
onclick="window.location = 'view-source:'+ 'http://www.csdn.net/'">
12. 怎樣通過asp的手段來檢查來訪者是否用了代理
<% if Request.ServerVariables("HTTP_X_FORWARDED_FOR")<>"" then response.write "您通過了代理服務(wù)器，"& _
"真實(shí)的IP為"&Request.ServerVariables("HTTP_X_FORWARDED_FOR")
end if
%>
13. 取得控件的絕對位置
//javascript
<script language="javascript">
function getIE(e){
var t=e.offsetTop;
var l=e.offsetLeft;
while(e=e.offsetParent){
t+=e.offsetTop;
l+=e.offsetLeft;
}
alert("top="+t+"nleft="+l);
}
</script>
//VBScript
<script language="VBScript"><!--
function getIE()
dim t,l,a,b
set a=document.all.img1 t=document.all.img1.offsetTop l=document.all.img1.offsetLeft
while a.tagName<>"BODY"
set a = a.offsetParent
t=t+a.offsetTop
l=l+a.offsetLeft
wend
msgbox "top="&t&chr(13)&"left="&l,64,"得到控件的位置"
end function
--></script>
14. 光標(biāo)是停在文本框文字的最后
<script language="javascript">
function cc()
{
var e = event.srcElement;
var r =e.createTextRange();
r.moveStart('character',e.value.length); r.collapse(true);
r.select();
}
</script>
<input type=text name=text1 value="123" onfocus="cc()">
15. 判斷上一頁的來源
asp:
request.servervariables("HTTP_REFERER"）
javascript:
document.referrer
16. 最小化、最大化、關(guān)閉窗口
<object id=hh1 classid="clsid:ADB880A6-D8FF-11CF-9377-00AA003B7A11">
<param name="Command" value="Minimize"></object> <object id=hh2 classid="clsid:ADB880A6-D8FF-11CF-9377-00AA003B7A11">
<param name="Command" value="Maximize"></object> <OBJECT id=hh3 classid="clsid:adb880a6-d8ff-11cf-9377-00aa003b7a11">
<PARAM NAME="Command" value="Close"></OBJECT> <input type=button value=最小化 onclick=hh1.Click()>
<input type=button value=最大化 onclick=hh2.Click()>
<input type=button value=關(guān)閉 onclick=hh3.Click()> 本例適用于IE
17.
<% '定義數(shù)據(jù)庫連接的一些常量
Const adOpenForwardOnly = 0 '游標(biāo)只向前瀏覽記錄，不支持分頁、Recordset、BookMark
Const adOpenKeyset = 1 '鍵集游標(biāo)，其他用戶對記錄說做的修改將反映到記錄集中，但其他用戶增加或刪除記錄不會反映到記錄集中。支持分頁、Recordset、BookMark
Const adOpenDynamic = 2 '動態(tài)游標(biāo)功能最強(qiáng)，但耗資源也最多。用戶對記錄說做的修改，增加或刪除記錄都將反映到記錄集中。支持全功能瀏覽(ACCESS不支持)。
Const adOpenStatic = 3 '靜態(tài)游標(biāo)，只是數(shù)據(jù)的一個快照，用戶對記錄說做的修改，增加或刪除記錄都不會反映到記錄集中。支持向前或向后移動
Const adLockReadOnly = 1 '鎖定類型，默認(rèn)的，只讀，不能作任何修改 Const adLockPessimistic = 2 '當(dāng)編輯時立即鎖定記錄，最安全的方式
Const adLockOptimistic = 3 '只有在調(diào)用Update方法時才鎖定記錄集，而在此前的其他操作仍可對當(dāng)前記錄進(jìn)行更改、插入和刪除等
Const adLockBatchOptimistic = 4 '當(dāng)編輯時記錄不會被鎖定，而更改、插入和刪除是在批處理方式下完成的 Const adCmdText = &H0001
Const adCmdTable = &H0002
%>
18. 網(wǎng)頁不會被緩存
HTM網(wǎng)頁
<META HTTP-EQUIV="pragma" CONTENT="no-cache">
<META HTTP-EQUIV="Cache-Control" CONTENT="no-cache, must-revalidate">
<META HTTP-EQUIV="expires" CONTENT="Wed, 26 Feb 1997 08:21:57 GMT">
或者<META HTTP-EQUIV="expires" CONTENT="0"> ASP網(wǎng)頁
Response.Expires = -1
Response.ExpiresAbsolute = Now() - 1 Response.cachecontrol = "no-cache"
PHP網(wǎng)頁
header("Expires: Mon, 26 Jul 1997 05:00:00 GMT"); header("Cache-Control: no-cache, must-revalidate"); header("Pragma: no-cache");
19. 檢查一段字符串是否全由數(shù)字組成
<script language="javascript"><!--
function checkNum(str){return str.match(/D/)==null}
alert(checkNum("1232142141"))
alert(checkNum("123214214a1"))
// --></script>
20. 獲得一個窗口的大小
document.body.clientWidth,document.body.clientHeight
21. 怎么判斷是否是字符
if (/[^x00-xff]/g.test(s)) alert("含有漢字"); else alert("全是字符");
22.TEXTAREA自適應(yīng)文字行數(shù)的多少
<textarea rows=1 name=s1 cols=27 onpropertychange="this.style.posHeight=this.scrollHeight">
</textarea>
23. 日期減去天數(shù)等于第二個日期
<script language=javascript> function cc(dd,dadd)
{
//可以加上錯誤處理
var a = new Date(dd)
a = a.valueOf()
a = a - dadd * 24 * 60 * 60 * 1000
a = new Date(a)
alert(a.getFullYear() + "年" + (a.getMonth() + 1) + "月" + a.getDate() + "日")
}
cc("12/23/2002",2)
</script>
24. 選擇了哪一個Radio
<HTML><script language="vbscript">
function checkme()
for each ob in radio1
if ob.checked then window.alert ob.value
next
end function
</script><BODY>
<INPUT name="radio1" type="radio" value="style" checked>Style
<INPUT name="radio1" type="radio" value="barcode">Barcode
<INPUT type="button" value="check" onclick="checkme()">
</BODY></HTML>
25.獲得本頁url的request.servervariables("")集合
Response.Write "<TABLE border=1><!-- Table Header --><TR><TD><B>Variables</B></TD><TD><B>value</B></TD></TR>" for each ob in Request.ServerVariables
Response.Write "<TR><TD>"&ob&"</TD><TD>"&Request.ServerVariables(ob)&"</TD></TR>"
next
Response.Write "</TABLE>"
26.
本機(jī)ip<%=request.servervariables("remote_addr")%>
服務(wù)器名<%=Request.ServerVariables("SERVER_NAME")%>
服務(wù)器IP<%=Request.ServerVariables("LOCAL_ADDR")%>
服務(wù)器端口<%=Request.ServerVariables("SERVER_PORT")%>
服務(wù)器時間<%=now%>
IIS版本<%=Request.ServerVariables"SERVER_SOFTWARE")%>
腳本超時時間<%=Server.ScriptTimeout%>
本文件路徑<%=server.mappath(Request.ServerVariables("SCRIPT_NAME"))%>
服務(wù)器CPU數(shù)量<%=Request.ServerVariables("NUMBER_OF_PROCESSORS")%>
服務(wù)器解譯引擎<%=ScriptEngine &
"/"&
ScriptEngineMajorVersion
&"."&ScriptEngineMinorVersion&"."&
ScriptEngineBuildVersion %>
服務(wù)器操作系統(tǒng)<%=Request.ServerVariables("OS")%> 27.ENTER鍵可以讓光標(biāo)移到下一個輸入框
<input onkeydown="if(event.keyCode==13)event.keyCode=9">
28. 檢測某個網(wǎng)站的鏈接速度：
把如下代碼加入<body>區(qū)域中:
<script language=javascript>
tim=1
setInterval("tim++",100)
b=1
var autourl=new Array()
autourl[1]="www.njcatv.net"
autourl[2]="javacool.3322.net"
autourl[3]="www.sina.com.cn"
autourl[4]="www.nuaa.edu.cn"
autourl[5]="www.cctv.com"
function butt(){
document.write("<form name=autof>")
for(var i=1;i<autourl.length;i++)
document.write("<input type=text name=txt"+i+" size=10 value=測試中„„> =》<input type=text name=url"+i+" size=40> =》<input
type=button value=GO onclick=window.open(this.form.url"+i+".value)><br/>") document.write("<input type=submit value=刷新></form>")
}
butt()
function auto(url){
document.forms[0]["url"+b].value=url
if(tim>200)
{document.forms[0]["txt"+b].value="鏈接超時"} else
{document.forms[0]["txt"+b].value="時間"+tim/10+"秒"} b++
}
function run(){for(var i=1;i<autourl.length;i++)document.write("<img src=http://"+autourl[i]+"/"+Math.random()+" width=1 height=1 onerror=auto('http://";;;+autourl[i]+"')>")}
run()</script>
29. 各種樣式的光標(biāo)
auto ：標(biāo)準(zhǔn)光標(biāo)
default ：標(biāo)準(zhǔn)箭頭
hand ：手形光標(biāo)
wait ：等待光標(biāo)
text ：I形光標(biāo)
vertical-text ：水平I形光標(biāo)
no-drop ：不可拖動光標(biāo)
not-allowed ：無效光標(biāo)
help ：?幫助光標(biāo)
all-scroll ：三角方向標(biāo)
move ：移動標(biāo)
crosshair ：十字標(biāo)
e-resize
n-resize
nw-resize
w-resize
s-resize
se-resize
sw-resize
1、 去掉IE的滾動條
有時候做好的網(wǎng)頁明明沒有超出窗口，可IE卻偏偏給加上滾動條，這樣看上去很不舒服，其實(shí)這也是可以通過一些小技巧避免的。具體如下：
<body style=”overflow-x:hidden”>„</body> //去掉X軸方向的滾動條
<body style=”overflow-y:hidden”>„</body> //去掉Y軸方向的滾動條
<body style=”overflow:hidden”>„</body> //去掉全部的滾動條
現(xiàn)在你看到的和你想像中的網(wǎng)頁應(yīng)該一樣了吧，如果其中有什么不明白的地方可以參照注釋中的說明。
2、 使網(wǎng)頁中的復(fù)制無效
有方法防止網(wǎng)頁被保存了，可不可以也防止網(wǎng)頁內(nèi)容被復(fù)制呢？答案是當(dāng)然可以?？纯聪旅娴睦幽憔蜁靼椎摹?
<html>
<head>
<script language=”javascript”>
function nocopy() {
alert(“對不起，你不能非法復(fù)制本站內(nèi)容”); event.returnvalue=false;
}
</script>
</head>
<body oncopy=”nocopy()”>copyright by commander.</body>
</html>
這其實(shí)中是利用了document的一個oncopy事件，也就是說當(dāng)發(fā)生復(fù)制事件時，彈出警告框，同時事件（event）的返回值為false使oncopy事件失效，從而達(dá)到防止復(fù)制的目的。
3、 用腳本控制瀏覽器
看到標(biāo)題是不是有點(diǎn)不相信，那么試試下面的這幾個例子吧！你一定會吃驚的。
在<body>和</body>之間加入如下代碼：
<button onclick=”document.execCommand(‘open’)”>打開</button>
<button onclick=”document.execCommand(‘saveas’)”>另存為„</button>
<button onclick=”document.execCommand(‘print’)”>打印</button>
上面其實(shí)都是利用了document.execCommand()這個內(nèi)置的函數(shù)，其參數(shù)為相應(yīng)的瀏覽器命令，還有很多命令就留給大家自己發(fā)現(xiàn)吧！
4、 IFrame也可以編輯文字
有沒有想過除了表單(<form>)之外還有其它的網(wǎng)頁元素可以編輯文字呢？只要使用IFrame的隱藏的一個屬性就可以使IFrame成為一個文本編輯器。
<html>
<body onload=”editer.document.designMode=’On’”> <IFrame ID=”editer”></IFrame>
</body>
</html>
其中designMode屬性表示IFrame的設(shè)計(jì)模式的狀態(tài)（開/關(guān)），還在猶豫什么呢，快試試吧！ 只要巧妙的利用這一特性就可以制作很多意想不到的效果。如果下面我們來做一個圖片編輯器。
<html>
<body onload=”imgEditer.document.designMode=’On’;imgEditer.document.write(‘<img src=圖片.gif>’)”> <IFrame id=”imgEditer”></IFrame>
</body>
</html>
用鼠標(biāo)點(diǎn)擊圖片是不是有新的發(fā)現(xiàn)，其實(shí)大家只要利用自己的想象和充分利用這個屬性一定能做出更多的花樣來。
5、 打開硬盤
這是打開硬盤的另一種方法，把它寫出來只是想告訴大家，要達(dá)到同一個目的有很多種方法，這里就是利用了表單的Action屬性達(dá)到的，其實(shí)打開硬盤有很多種方法，只是這種不太被人們注意，所以這里就選擇了這種方法。
<form action=file ://c|><input type=”submit” value=”打開C盤”></form>
