自整計(jì)算機(jī)web制作ps復(fù)習(xí)提綱

1、 10英政第 1 章 Web技術(shù)基礎(chǔ)一、 萬維網(wǎng)1、Internet的發(fā)展（1）Internet的產(chǎn)生l 阿帕網(wǎng)（ARPANet），萌芽u 一個(gè)沒有中央控制節(jié)點(diǎn)的計(jì)算機(jī)網(wǎng)絡(luò)，1969u TCP/IP協(xié)議研究成功 ，計(jì)算機(jī)互聯(lián)的主要障礙被解決 ，1974l 互聯(lián)網(wǎng)的誕生u ARPANet被分成兩部分，一部分作為軍用，稱為MILnet，另一部分作為民用，ARPANet開始從一個(gè)實(shí)驗(yàn)型網(wǎng)絡(luò)向?qū)嵱眯途W(wǎng)絡(luò)轉(zhuǎn)變，從而成為全球Internet正式誕生的標(biāo)志。1982（2）發(fā)展階段l Internet的提出、研究和試驗(yàn)階段 ，19691984 l Internet的實(shí)用發(fā)展階段 ， 19841992l 商業(yè)化

2、發(fā)展階段 ，19922003 l Web2.0，2003以后u 用戶參與，如：論壇，博客。留住客戶，信息消費(fèi)到信息制造2、什么是萬維網(wǎng)l WWW是環(huán)球信息網(wǎng)（World Wide Web ）的縮寫，也可以簡(jiǎn)稱為Web，中文名字為“萬維網(wǎng)”。l 在互聯(lián)網(wǎng)中，存在各種服務(wù)器和客戶機(jī)，WWW =Web服務(wù)器+Web客戶機(jī)，即Web由Internet中稱為Web信息服務(wù)器的計(jì)算機(jī)組成，由那些希望通過Internet發(fā)布信息的機(jī)構(gòu)提供并管理。二、 Web的工作原理1、Web的構(gòu)成（1）Web服務(wù)器l 網(wǎng)絡(luò)操作系統(tǒng)l Web服務(wù)組件，如Apache/Tomcat，IIS（2）Web客戶機(jī)l Web瀏覽器，

3、如IE，Mahton，F(xiàn)irefox2、Web的工作原理（1）在瀏覽器地址欄中，用戶輸入要訪問的網(wǎng)頁(yè)網(wǎng)址URL （2）Web服務(wù)器根據(jù)URL中指定的網(wǎng)址、路徑和網(wǎng)頁(yè)文件，調(diào)出相應(yīng)的HTML、XML文檔或Jsp、Asp文件（3）根據(jù)文檔類型，Web服務(wù)器決定是否執(zhí)行文檔中的服務(wù)器腳本程序，還是直接將網(wǎng)頁(yè)文件傳送到客戶端。（4）瀏覽器顯示下載的文檔，即網(wǎng)頁(yè) 3、瀏覽器的功能從本質(zhì)上講，瀏覽器是一種特定格式，即HTML或XML的文檔閱讀器，它能夠根據(jù)網(wǎng)頁(yè)內(nèi)容，對(duì)網(wǎng)頁(yè)中的各種標(biāo)記進(jìn)行解釋顯示。瀏覽器是一種程序解釋機(jī)，內(nèi)置腳本程序引擎，如果網(wǎng)頁(yè)中包含客戶端腳本程序，瀏覽器將解釋執(zhí)行這些客戶端腳本代碼，從

4、而增強(qiáng)網(wǎng)頁(yè)的交互性和動(dòng)態(tài)效果。三、 概念及術(shù)語1、網(wǎng)站的概念及構(gòu)成（1）概念：網(wǎng)站又稱Web站點(diǎn)，是Internet中提供信息服務(wù)的機(jī)構(gòu)，這些機(jī)構(gòu)的計(jì)算機(jī)連接到Internet中，向用戶提供Web服務(wù)。（2）構(gòu)成：一個(gè)Web站點(diǎn)是由一個(gè)主目錄和主目錄下的文件夾和大量的網(wǎng)頁(yè)文件構(gòu)成的，這些網(wǎng)頁(yè)文件通過超鏈接連接在一起，形成特定的應(yīng)用邏輯，構(gòu)成一個(gè)特定的Web應(yīng)用。2、超文本概念、超級(jí)鏈接的概念（1）超文本（Hypertext）超文本是一種文本顯示與連接技術(shù)，可以對(duì)文本中的有關(guān)詞匯或句子建立鏈接（即超鏈接），使其指向其他段落、文本或鏈接到其他文檔。 當(dāng)超文本顯示時(shí)，建立了鏈接的文本、圖片通常以下劃

5、線、高亮等不同的方式顯示，來表明這些文本或圖片對(duì)應(yīng)一個(gè)超鏈接。 （2）超級(jí)鏈接（Hyperlink）：Web頁(yè)中當(dāng)用戶單擊它時(shí)可以轉(zhuǎn)到其他Web頁(yè)或當(dāng)前頁(yè)面的其他地方的文字、圖片等對(duì)象3、Web頁(yè)的概念、主頁(yè)的概念（1）Web頁(yè)（Web page）：Web頁(yè)是指Web服務(wù)器上的一個(gè)個(gè)超文本文件，或者是它們?cè)跒g覽器上的顯示屏幕。 （2）主頁(yè)（Home page）：用戶在Web服務(wù)器上看到的第一個(gè)Web頁(yè) 首頁(yè)中往往列出了網(wǎng)站的信息目錄，或指向其他站點(diǎn)的超鏈接，主頁(yè)是一個(gè)網(wǎng)站的入口。 4、統(tǒng)一資源定位器URL、端口（1）統(tǒng)一資源定位器URL統(tǒng)一資源定位器URL可以唯一標(biāo)識(shí)一個(gè)Web頁(yè)或Intern

6、et上其他資源的一個(gè)地址，它將Internet提供的各類服務(wù)統(tǒng)一編址，以便用戶通過Web客戶瀏覽程序進(jìn)行信息查詢。URL的一般形式為：信息資源類型：/網(wǎng)址：端口號(hào)/文件路徑/文件名？參數(shù)表（2）端口含義：端口是服務(wù)器使用的一個(gè)通道，在OSI參考模型的數(shù)據(jù)封裝中使用，它可以使具有相同IP地址的服務(wù)器同時(shí)提供多種服務(wù)，運(yùn)行在服務(wù)器上的各個(gè)服務(wù)程序?qū)⒏鶕?jù)收到的數(shù)據(jù)段中的端口號(hào)來判斷是否為自己的數(shù)據(jù)。分類：按協(xié)議類型劃分，端口可以分為TCP、UDP、IP和ICMP（Internet控制消息協(xié)議）等。其中TCP端口和UDP端口是最常見端口類型。按照端口號(hào)分布劃分，端口分為知名端口（Well-Known

7、Ports）和動(dòng)態(tài)端口（Dynamic Ports）兩部分。四、 Web相關(guān)技術(shù)1、C/S結(jié)構(gòu)即客戶/服務(wù)器計(jì)算模式構(gòu)成：兩層結(jié)構(gòu)（Client/Server，C/S） 20世紀(jì)80年代流行 客戶機(jī)安裝客戶端軟件：客戶機(jī)完成與用戶的交互任務(wù)，具有強(qiáng)壯的數(shù)據(jù)操縱和事務(wù)處理能力 服務(wù)器安裝服務(wù)器程序：服務(wù)器負(fù)責(zé)數(shù)據(jù)管理，提供數(shù)據(jù)庫(kù)的查詢和管理、大規(guī)模的計(jì)算等服務(wù) 它依賴于計(jì)算機(jī)局域網(wǎng)。優(yōu)點(diǎn)通過異種平臺(tái)集成，能夠協(xié)調(diào)現(xiàn)有的各種IT基礎(chǔ)結(jié)構(gòu)；分布式管理；能充分發(fā)揮客戶端PC的處理能力，安全、穩(wěn)定、速度快，且可脫機(jī)操作 不足它必須在客戶端安裝大量的應(yīng)用程序（客戶端軟件），開發(fā)成本較高，移植困難，用戶界面

8、風(fēng)格不統(tǒng)一，使用繁雜，不利于推廣使用，維護(hù)復(fù)雜，升級(jí)麻煩，信息內(nèi)容和形式單一，新技術(shù)不能輕易應(yīng)用用戶必須在局域網(wǎng)中，對(duì)90年代蓬勃發(fā)展的互聯(lián)網(wǎng)新技術(shù)不能適應(yīng)2、B/S結(jié)構(gòu)即瀏覽器/服務(wù)器計(jì)算模式構(gòu)成：是一種三層架構(gòu)瘦客戶機(jī)/服務(wù)器計(jì)算模式第一層是客戶端表示層：客戶端Web瀏覽器第二層是應(yīng)用服務(wù)器層：Web服務(wù)器第三層是數(shù)據(jù)中心層：數(shù)據(jù)庫(kù)服務(wù)器它適用于互聯(lián)網(wǎng)。優(yōu)點(diǎn)：具有良好的開放性，利用單一的訪問點(diǎn)，用戶可以在任何地點(diǎn)使用系統(tǒng)；用戶可以跨平臺(tái)以相同的瀏覽器界面訪問系統(tǒng)；因?yàn)樵诳蛻舳酥恍枰惭b瀏覽器，基本上取消了客戶端的維護(hù)工作，有效的減少了整個(gè)系統(tǒng)的運(yùn)行和維護(hù)成本。跨越了局域網(wǎng)的限制，將應(yīng)用分布

9、到互聯(lián)網(wǎng) 第 2 章 標(biāo)記語言與網(wǎng)頁(yè)制作一、HTML標(biāo)記語法和文檔結(jié)構(gòu)（一） HTML標(biāo)記語法1.標(biāo)記（Tag）標(biāo)記由封裝在小于號(hào)（<）和大于號(hào)（>）構(gòu)成的一對(duì)尖括號(hào)之中 一般形式：<標(biāo)記>文檔內(nèi)容</標(biāo)記> <標(biāo)記> 起始標(biāo)記 （首標(biāo)記） </標(biāo)記>結(jié)束標(biāo)記（尾標(biāo)記） 例如：<a>link text</a> -一個(gè)HTML元素(1)標(biāo)記類型：?jiǎn)螛?biāo)記<br><hr>雙標(biāo)記<head></head><body></body> (2)標(biāo)記屬性：

10、在起始標(biāo)記可包含HTML屬性(3)標(biāo)記語法：<標(biāo)記 屬性1="屬性值“ 屬性2="屬性值" 屬性3="屬性值"> 每個(gè)元素可含多個(gè)屬性，屬性間無順序之分，屬性值可用單引號(hào)、雙引號(hào)為界符，也可不加界符。例如：<hr size="3" align="center" width="50%"> 常用的共同標(biāo)記屬性（二）HTML文檔結(jié)構(gòu)1.文檔結(jié)構(gòu)：<html><head> 頭部信息</head><body> 文檔主體 （語

11、句部分）</body></html>2. 修改默認(rèn)顯示的方法：當(dāng)一個(gè)用戶自定義的樣式要應(yīng)用到文檔中的所有元素（標(biāo)記）時(shí)，應(yīng)該在文檔的頭部使用<style></style>標(biāo)記對(duì)重新定義這些標(biāo)記的樣式。<style>標(biāo)記放置在HTML文檔的<head></head>內(nèi)，用于定義樣式。使用<style>標(biāo)記可以為網(wǎng)頁(yè)設(shè)置不同的樣式屬性，一般形式為：<style type="text/css"> 標(biāo)記屬性名：屬性值；屬性名：屬性值；</style>例如：要設(shè)置整

12、個(gè)文檔的字體顏色和背景色，可以定義下面的樣式。 <style type="text/css"> Bodycolor:black;background:white;</style> 二、應(yīng)用 （一）文件頭標(biāo)記及子標(biāo)記<head></head>標(biāo)記對(duì)之間的部分稱為文件頭 （二）文件體標(biāo)記及其屬性 1.<title></title>標(biāo)記:文檔標(biāo)題標(biāo)記 作用：用于標(biāo)識(shí)網(wǎng)頁(yè)主題，其中的內(nèi)容將在瀏覽器的標(biāo)題欄中顯示，不出現(xiàn)在頁(yè)面內(nèi)。 每個(gè)頁(yè)面只允許有一個(gè)<title>標(biāo)記舉例：<title>

13、計(jì)算機(jī)基礎(chǔ)網(wǎng)絡(luò)教學(xué)平臺(tái)GSL3.0</title>2.<meta>標(biāo)記 作用：提供文檔的元信息，包括網(wǎng)頁(yè)作者、制作日期、口令、關(guān)鍵字等等 <meta>為單標(biāo)記，沒有尾標(biāo)記 (1)http-equiv屬性：http-equiv相當(dāng)于HTTP的文件頭，向?yàn)g覽器傳回信息，以正確顯示網(wǎng)頁(yè)內(nèi)容<meta http-equiv="參數(shù)" content="參數(shù)變量值"> http-equiv屬性參數(shù)值：content-type（顯示字符集的設(shè)定），設(shè)定頁(yè)面使用的字符集，描述網(wǎng)頁(yè)的類型和編碼信息。 <meta ht

14、tp-equiv="content-type" content="text/html; charset=gb2312"> expires（期限），用于設(shè)定網(wǎng)頁(yè)的到期時(shí)間 <meta http-equiv="expires" content="Thur, 8 May 2008 18:18:18 GMT"> pragma（Cache模式），禁止瀏覽器從本地計(jì)算機(jī)的緩存中訪問頁(yè)面內(nèi)容 <meta http-equiv=“pragma” content=“no-cache”> ，該種設(shè)定訪問者

15、將無法使用脫機(jī)瀏覽功能 refresh（刷新），自動(dòng)刷新并指向新頁(yè)面。 <meta http-equiv="refresh" content="60; url=new.htm"> window-target（顯示窗口的設(shè)定），強(qiáng)制頁(yè)面在當(dāng)前窗口以獨(dú)立頁(yè)面顯示 <meta http-equiv="window-target" content="_top">，可以用來防止別人在框架里調(diào)用自己的頁(yè)面。 (2)name屬性主要提供作者、版權(quán)、或其他描述信息，與之對(duì)應(yīng)的屬性值為content，cont

16、ent中的內(nèi)容主要是便于搜索引擎查找信息和分類信息用的。 <meta name="參數(shù)" content="具體的參數(shù)值"> name屬性參數(shù)值:keywords（關(guān)鍵字），keywords用來告訴搜索引擎該網(wǎng)頁(yè)的關(guān)鍵字是什么 。 <meta name="keywords" content="E-learning,ontology"> description（網(wǎng)站內(nèi)容描述），description用來告訴搜索引擎網(wǎng)站的主要內(nèi)容 <meta name="description&

17、quot; content="This page is about E-learning etc."> author（作者），標(biāo)注網(wǎng)頁(yè)的作者 <meta name="author" content="brion"> robots（機(jī)器人向?qū)В?，robots用來告訴搜索機(jī)器人需要索引的頁(yè)面有哪些。 <meta name="robots" content="none"> （3） <base>標(biāo)記<base>標(biāo)記<base>標(biāo)記定義了文

18、檔的基礎(chǔ)URL地址，在文檔中所有的相對(duì)地址形式的URL都是相對(duì)于這里定義的URL而言的 。 文檔中的<base>標(biāo)記不能多于一個(gè)，必須放于頭部，并且應(yīng)該在任何包含URL地址的語句之前 <base>標(biāo)記屬性:href屬性 ，指定了文檔的基礎(chǔ)URL地址，該屬性在<base>標(biāo)記中是必須存在的 。 <base href = "">target屬性 target屬性同框架一起使用，它定義了當(dāng)文檔中的鏈接被點(diǎn)擊后，在哪一個(gè)框架中展開頁(yè)面。常用的target的屬性值有：_blank ，_self ，_parent ，_top _blank

19、: 表明在新窗口打開頁(yè)面_self： 表明在當(dāng)前文檔的框架中打開頁(yè)面_parent：表明在當(dāng)前文檔的父窗口中打開頁(yè)面_top ：在鏈接所在的完整窗口打開頁(yè)面<base target="_blank"> 表明頁(yè)面上所有的鏈接都在新窗口打開（4） <link>標(biāo)記 <link>標(biāo)記<link>標(biāo)記定義了文檔之間的包含 。 在HTML的頭部可以包含任意數(shù)量的<link>標(biāo)記 <link>標(biāo)記屬性:type，用于指定被包含的文件類型。例如，text/css是指包含一個(gè)層疊樣式表文件。 href，指向被包含資源的

20、url地址 。 title，一個(gè)字符串，用于描述該鏈接關(guān)系。 rel，定義HTML文檔和所要包含資源之間的鏈接關(guān)系 例如：<link type="text/css" rel="stylesheet" href="mystyle.css">(5) 背景音樂標(biāo)記<bgsound> 在文檔頭內(nèi)，還可以定義背景音樂，標(biāo)記為<bgsound>，用以插入背景音樂。<bgsound>標(biāo)記為單標(biāo)記，一般形式是：<bgsound src="" autostart="&q

21、uot; loop="">標(biāo)記的屬性：Src屬性，給出音樂文件的URL。Autostart屬性，設(shè)置音樂文件播送結(jié)束后的處理，如果為true，則自動(dòng)播放音樂，為false則結(jié)束不播放，默認(rèn)值為false。Loop屬性，設(shè)置是否自動(dòng)反復(fù)播放，loop=2表示重復(fù)兩次，infinite表示重復(fù)多次。 （三）文檔內(nèi)容常用標(biāo)記1、 標(biāo)題、段落標(biāo)記 （1）標(biāo)題標(biāo)記<h1></h1><h6></h6> 從最大的h1到最小的h6，6個(gè)級(jí)別的標(biāo)題標(biāo)記屬性：Align<h1 align=left>第一級(jí)標(biāo)題</h1>

22、;<h2 align=left>第二級(jí)標(biāo)題</h2><h3 align=left>第三級(jí)標(biāo)題</h3><h4 align=left>第四級(jí)標(biāo)題</h4><h5 align=left>第五級(jí)標(biāo)題</h5><h6 align=left>第六級(jí)標(biāo)題</h6>（2）段落標(biāo)記<p></p>，標(biāo)記一個(gè)段落，輸出位置轉(zhuǎn)到下一行開始，并增加一個(gè)空行。標(biāo)記屬性： Align<p align=left>段落內(nèi)容</p>（3）換行與空行標(biāo)記 <

23、br>換行標(biāo)記，單標(biāo)記，可以使用它增加一個(gè)空行。（4）水平線標(biāo)記水平線標(biāo)記<hr> ，插入一條水平線， 單標(biāo)記。標(biāo)記屬性：width；size；Color（5） 預(yù)格式化段落標(biāo)記<pre>. </pre>是文本以錄入的原樣顯示一、 文本格式標(biāo)記（1）字體標(biāo)記<font></font>常用的屬性：face：設(shè)置字體size：設(shè)置文字大小，取值17，可用+n、n表示比當(dāng)前字體增大、減小color：設(shè)置文字顏色（2）粗體、斜體和下劃線標(biāo)記 <b></b> 粗體標(biāo)記<i> </i> 斜體標(biāo)

24、記<u></u> 下劃線標(biāo)記（3）字體放大、縮小、上標(biāo)和下標(biāo)顯示標(biāo)記 < big></big>放大< small></small>縮小上標(biāo)下標(biāo) （4） 邏輯格式化文本標(biāo)記 <strong></strong>標(biāo)記和<b></b>標(biāo)記類似，都是字體加粗標(biāo)記。 <em></em>標(biāo)記和<i></i>標(biāo)記類似，是斜體強(qiáng)調(diào)標(biāo)記。 <tt>

25、;</tt>為打字字體 Courier字體，字母等寬標(biāo)記。<cite></cite>為傳記引述斜體效果標(biāo)記。 1. 圖像標(biāo)記<img> （1）作用：?jiǎn)螛?biāo)記，用以插入圖像 <img scr=“#”> 例：<img src=“asd.jpg" alt="風(fēng)景" width="400px" height="300px">（2）<img>標(biāo)記屬性src：設(shè)置插入圖像的url地址，即插入圖像的路徑和文件名。 title：屬性值為一字符串，鼠標(biāo)指向圖片時(shí)

26、，鼠標(biāo)右下角顯示標(biāo)題文本。 alt：設(shè)置圖像替代文字，主要用于在瀏覽器還沒有裝入圖像（或關(guān)閉圖像顯示）的時(shí)候，此圖像的顯示信息。id:制定圖片id號(hào)，用于對(duì)圖像的程序訪問。class：指定圖像所屬的類型<img src=“asd.jpg" alt="風(fēng)景" width="400px" height="300px">（3）<img>標(biāo)記的外觀屬性align：設(shè)置圖像的對(duì)齊方式 top：圖片頂端與文字頂端對(duì)齊middle：圖片垂直中線與文字基線對(duì)齊bottom：圖片底端與文字基線對(duì)齊left：圖片在當(dāng)前窗

27、口的左側(cè)，文字在右側(cè)right：圖片在當(dāng)前窗口的右側(cè)，文字在左側(cè)border：設(shè)置圖片邊框?qū)挾取?height：用于設(shè)置圖像的高度width：用于設(shè)置圖像的寬度 hspace和vspace：分別用于設(shè)置圖像周圍的空白大小 （4） 事件屬性如onLock、onClick、onDbClick、onMouseOver、onKeyDown、onKeyPress等2. 超鏈接標(biāo)記<a></a> （1）文本超鏈接 <a href=“鏈接地址">字符串</a> （2）圖片超鏈接<a href=“鏈接地址”> <img src=“圖片

28、文件"> </a>可使用圖片鏈接實(shí)現(xiàn)縮略圖<a href=“路徑/大圖文件名”> <img src=“路徑/小圖文件名"> </a>（3）書簽定義書簽：<a name=“#書簽名">書簽文本</a>書簽鏈接引用：<a ahref=“#書簽名”>鏈接文本</a>（4）郵箱地址鏈接<a href=“mailto：郵箱地址">郵箱地址字符串</a>（5）<a>標(biāo)記其它常用屬性target屬性，定義超鏈接打開的目標(biāo)窗口。 屬性

29、值：_self（相同框架）_blank（新建窗口）_top（整頁(yè)）_parent（父窗口）title屬性：鏈接注釋，屬性值為一字符串，鼠標(biāo)指向超鏈接時(shí)，鼠標(biāo)右下角顯示標(biāo)題文本。 onclick事件屬性 3. 影像地圖標(biāo)記<map> </map> 所謂影像地圖，就是在一個(gè)圖片上定義一系列區(qū)域，每個(gè)區(qū)域?qū)?yīng)一個(gè)超鏈接。 （1）標(biāo)記形式<img src=“ ” usemap=“#mapname” width=" " height=" "><map name="mapname"><area

30、 href=“url1“ target=“_blank” title=“提示文字 “ shape=”circle” coords=“圓心x, 圓心y, 半徑” ><area href=“url2” target=“_blank” title=“提示文字 “ shape=”rect” coords=“左上角x，左上角y，右下角x，右下角y" ><area href=“url3” target=“_blank” title=“提示文字 ”shape=“poly” coords=“頂點(diǎn)坐標(biāo)序列" ></map> （2）熱點(diǎn)標(biāo)記（<m

31、ap>）屬性href屬性：用于設(shè)定該熱點(diǎn)所鏈接的url地址。Shape屬性：用于設(shè)定熱點(diǎn)的形狀。coods屬性：用于設(shè)定熱點(diǎn)的坐標(biāo)。shape=“rect” ，shape=“circle” ，shape=“poly”<img src=“aaa.jpg ” usemap=“#mapna” width=“ 300 " height=“500 "><map name="mapna"><area href=“1.htm“ shape=”circle” coords=“379, 1212, 79” target=“_blank”

32、 title=“區(qū)域1"><area href="2.htm" shape="rect" coords="224,159,274,180" target="_blank" title="區(qū)域2" ><area href=“3.htm” shape=“poly” coords=“" target="_blank" title="區(qū)域3" ></map> 4. 走馬燈標(biāo)記<marquee>

33、;</marquee>“走馬燈”標(biāo)記<marquee></marquee>用于標(biāo)記一行或多行滾動(dòng)的文本，也可以將文本帶有超鏈接，以增加網(wǎng)頁(yè)的動(dòng)態(tài)效果。 <marquee>標(biāo)記常用屬性：align屬性，設(shè)定活動(dòng)字幕的位置，取值可以是left、center、right、top或bottom。 bgcolor屬性，設(shè)定活動(dòng)字幕的背景顏色，一般是十六進(jìn)制數(shù)。 direction屬性，設(shè)定活動(dòng)字幕的滾動(dòng)方向，取值可以是left、right、up或down。 behavior屬性，設(shè)定滾動(dòng)的方式，主要有三種方式：behavior=“scroll”表示由一端滾

34、動(dòng)到另一端； behavior=“slide”表示由一端快速滑動(dòng)到另一端，且不再重復(fù)； behavior=“alternate”表示在兩端之間來回滾動(dòng)。 height和width屬性，設(shè)定滾動(dòng)字幕的高度和寬度。 hspace和vspace屬性，設(shè)定滾動(dòng)字幕的左右邊框和上下邊框的寬度。 scrollamount屬性，設(shè)定活動(dòng)字幕的滾動(dòng)距離。 scrolldelay屬性，用于設(shè)定滾動(dòng)兩次之間的延遲時(shí)間。 loop屬性，用于設(shè)定滾動(dòng)的次數(shù)，當(dāng)loop=-1表示一直滾動(dòng)下去，直到頁(yè)面更新。 5. 注釋標(biāo)記注釋標(biāo)記一般的形式是<!注釋文字>，用于在HTML文檔中書寫說明性文字，注釋文字可以多

35、行，內(nèi)容在瀏覽器中不顯示。8.特殊字符不可分的空格 &nbsp；小于 &lt；大于 &gt；邏輯與& &amp； 雙引號(hào) &quot； 版權(quán)符號(hào) © &copy； 注冊(cè)商標(biāo) ® &reg；商標(biāo) 大于 &#8482 （四）表格（table）表格是由行、列構(gòu)成的。每一行可以分成若干列，每一列成為一個(gè)單元格，相鄰的單元格可以合并。1.應(yīng)用：表格的用途很廣，可以用來顯示表格型數(shù)據(jù)、圖片等，也可以用來布局。表格單元格中可以放置文本、段落、圖片、鏈接、表單、HTML控件、表格等等。2.相關(guān)標(biāo)記：（1）表格標(biāo)記 &l

36、t;table></table> 表格是HTML常用的標(biāo)簽，代表在網(wǎng)頁(yè)中插入一張表格。表格是用table標(biāo)簽對(duì)表示的。 任何表格都是由<table>開始，由</table> 結(jié)束。（2）行標(biāo)記<tr></tr> <tr></tr>是表格一行的標(biāo)記，標(biāo)記<table> 與</table>之間可以包含多個(gè)<tr>標(biāo)記。（3）列標(biāo)記<td></td><td></td>為表格的單元格標(biāo)記，標(biāo)記<tr> 與</tr

37、>之間可以包含多個(gè)<td>標(biāo)記。（4）標(biāo)記<th></th>用來設(shè)置表格的表頭。通過增減<td></td>標(biāo)記，實(shí)現(xiàn)表格的行的增加、刪除。（5） 標(biāo)題標(biāo)記<caption></ caption >為表格設(shè)置標(biāo)題，屬性align，指定位置，取值top、bottom。表格相關(guān)標(biāo)記屬性（1）一般屬性bgcolor：設(shè)置背景色，可應(yīng)用于<table>、 <tr>、<td>標(biāo)記 ，分別設(shè)置表格、行、單元格的背景色。background：應(yīng)用于<table>，設(shè)置表格的

38、背景圖片。border：應(yīng)用于<table>，設(shè)置表格的邊框，默認(rèn)為0，無邊框。bordercolor ：應(yīng)用于<table>，設(shè)置表格的邊框顏色。bordercolorlight：應(yīng)用于<table>，設(shè)置表格的邊框明亮部分的顏色。bordercolordark：應(yīng)用于<table>，設(shè)置表格的邊框昏暗部分的顏色。width：設(shè)置寬度，可應(yīng)用于<table>、<td>標(biāo)記 ，分別設(shè)置表格、單元格的寬度。應(yīng)用于<td>標(biāo)記 時(shí)，常用%表示。height：設(shè)置高度，可應(yīng)用于<table>、 <t

39、r>標(biāo)記 ，分別設(shè)置表格、單元格的高度。align：設(shè)置水平對(duì)齊方式，可應(yīng)用于<table>、 <tr>、<td>標(biāo)記。align：設(shè)置水平對(duì)齊方式，可應(yīng)用于<table>、 <tr>、<td>標(biāo)記，取值center、left、right。valign：設(shè)置垂直對(duì)齊方式，可應(yīng)用于<table>、 <tr>、<td>標(biāo)記，取值top、middle、bottom、baseline。cellspacing：應(yīng)用于<table>，設(shè)置表格的相鄰單元格間的間距。cellpaddi

40、ng：應(yīng)用于<table>，設(shè)置表格的單元格邊框與內(nèi)容的間距。rowspan：?jiǎn)卧竦男泻喜?。colspan：?jiǎn)卧竦牧泻喜?。?）事件屬性 （五）表單（form） 1.用戶交互使用表單，可以動(dòng)態(tài)的收集用戶數(shù)據(jù)，完成用戶與網(wǎng)站間的交互。（1）表單標(biāo)記<form></form> <form></form>可以看做是一個(gè)包含許多表單控件的容器。它的功能：排列各種表單控件的布局；把整個(gè)最終處理數(shù)據(jù)結(jié)果發(fā)送到目標(biāo)程序上；定義一種數(shù)據(jù)發(fā)送到服務(wù)器的方法；用來解碼服務(wù)器所能接受和處理的數(shù)據(jù)。一般形式：<form > 表單元素</

41、form> <form>標(biāo)記屬性name：給出表單的名稱，用于腳本編程 method：用來定義服務(wù)器表單處理程序從表單中獲得信息的方式get方法：將數(shù)據(jù)打包放置在環(huán)境變量QUERY_STRING中作為URL整體的一部分傳遞給服務(wù)器。 post方法：分離地傳遞數(shù)據(jù)給服務(wù)器表單處理程序，不需要設(shè)置QUERY_STRING環(huán)境變量，因此POST有更好的安全性，表單中數(shù)據(jù)的多少是任意的，因?yàn)檫@些數(shù)據(jù)從來也不分配到一個(gè)變量里。 action：設(shè)置表單處理程序的網(wǎng)絡(luò)路徑和程序名，當(dāng)用戶提交表單時(shí)，服務(wù)器將執(zhí)行action屬性所設(shè)置的程序。 （2）輸入類型標(biāo)記 <input type

42、="" name = "" value="" >< input >標(biāo)記屬性：type：給出輸入控件的類型，常用的控件類型有：text，textarea，radio，checkbox，button，image，hidden，password，file，submit/reset name：設(shè)置輸入控件的名字，程序需要通過控件名稱處理用戶輸入數(shù)據(jù)，同時(shí)，設(shè)置控件名稱可以增加HTML代碼的可讀性。 value：保存用戶的輸入和選擇，服務(wù)器通過調(diào)用輸入?yún)^(qū)域的value屬性值來獲得輸入控件的數(shù)據(jù)。另外，用戶可以通過value屬性

43、來指定輸入?yún)^(qū)域的缺省值 。 2.表單控件：?jiǎn)涡形谋究蜉斎朊艽a文本框輸入 多行文本框輸入 button按鈕輸入 radio單選鈕輸入 復(fù)選框輸入復(fù)選列表框輸入hidden隱藏元素 文件上傳 表單提交按鈕標(biāo)記submit/reset （1）text：?jiǎn)涡形谋究蜉斎?lt;input type="text" name = "" value="">主要屬性：name：文本框名稱，便于程序獲取用戶輸入。 value：存儲(chǔ)文本框的取值，可以設(shè)一個(gè)初始值。 size：設(shè)置表示文本框的顯示長(zhǎng)度。 maxlength：文本框中輸入的有效數(shù)據(jù)長(zhǎng)度。

44、 例如：<form name="myForm" method="POST" action="/custom/feedback.jsp">用戶賬戶：<input type="text" name=“myaccount" size="10" value="guest" maxlength="8"> </form> （2）password：密碼文本框輸入使用輸入密碼文本框控件，當(dāng)用戶輸入密碼時(shí)，區(qū)域內(nèi)將會(huì)顯示&quo

45、t;*"號(hào) <input type=" password " >主要屬性：name：文本框名稱，便于程序獲取用戶輸入。 value：存儲(chǔ)文本框的取值，可以設(shè)一個(gè)初始值。 size：設(shè)置表示文本框的顯示長(zhǎng)度。 maxlength：maxlength是文本框中輸入的有效數(shù)據(jù)長(zhǎng)度。 例如：<form name="myForm" method="POST" action="/progs/feedback.jsp">密碼：<input type="password"

46、 name="myPassword" size="10" maxlength="8"> </form>（3）textarea：多行文本框輸入標(biāo)記多行文本框，又稱滾動(dòng)文本框。和其它的輸入類型不同，它不是通過<input type=" " >來指定的，它是一個(gè)雙標(biāo)記 <textarea name=" " rows=" " cols=""> input text</textarea> 主要屬性：name：，多

47、行文本框的名稱，便于程序獲取用戶輸入。 rows、cols：分別用來設(shè)置文本框的列數(shù)和行數(shù)，列與行以字符數(shù)為單位。input text：顯示的初始文本內(nèi)容，一般為提示。 例如：<form name="myForm" method="POST" action="-WEBBOT-SELF-"><textarea name="brief" rows="5" cols="30">請(qǐng)輸入簡(jiǎn)要說明</textarea></form>（4）

48、radio：?jiǎn)芜x鈕輸入<input type=“ radio” value =“choice_id” > 單選鈕主要用于從多個(gè)可選項(xiàng)中，選擇其中之一。往往是若干個(gè)radio為一組，他們具有相同的name，但不同的value，從而選擇其中之一。主要屬性：name：?jiǎn)芜x扭的名稱，一般是若干個(gè)radio一組，取相同的name。 checked：用來設(shè)置該單選框缺省時(shí)是否被選中，相同name的多個(gè)radio中只能有一個(gè)選擇，或都不使用該參數(shù)。 value：存儲(chǔ)單旋鈕的取值，多個(gè)具有相同name的單旋鈕應(yīng)該具有不同的value。（5）checkbox:復(fù)選框輸入復(fù)選框是對(duì)某種輸入做出“是”或

49、“否”的選擇<input type=" checkbox " >常用屬性：name: 設(shè)置復(fù)選框的名稱，便于程序獲取用戶輸入value：每一個(gè)checkbox 必須有一個(gè)value，當(dāng)復(fù)選框選中時(shí)，value值便會(huì)傳到表單的action屬性指定的程序中。 checked：用來設(shè)置該復(fù)選框缺省時(shí)是否被選中。 （6） select：復(fù)選列表框創(chuàng)建一個(gè)下拉列表框或可以復(fù)選的列表框，定義復(fù)選列表框不需要在<input type=“ ”>中指定輸入類型<select name="" size=""> <

50、option value=""></option> <option value=""></option> </select> <select>標(biāo)記 屬性：name：name為下拉式列表控件名稱，便于程序獲取用戶輸入。 size：下拉式列表的高度，缺省時(shí)值為1，若沒有設(shè)置（加入）multiple屬性，顯示的將是一個(gè)彈出式的列表框。若使用此參數(shù)則不會(huì)有PopUp效果。如果小于可選的項(xiàng)目數(shù)量，則出現(xiàn)垂直滾動(dòng)條。 multiple：指定是否可以多選。multiple屬性不用賦值，直接加入<s

51、elect>標(biāo)記中即可使用，加入了此屬性后列表框就成了可多選的了。 （7） hidden隱藏元素在一個(gè)表單中，可以定義隱藏表單元素，它在網(wǎng)頁(yè)上并不顯示，不需要用戶輸入，主要目的是隨表單一起傳給表單處理程序一個(gè)特定的值，用于為網(wǎng)頁(yè)處理程序傳送數(shù)據(jù)。<input type="hidden" name=" " value=" "> 例如：<input type="hidden" name="myID" value="730118">（8）file:文件

52、上傳<input type="file" name=" " size=" “ accept=" " > 一般屬性：name: 為控件名稱，size: 顯示文本框長(zhǎng)度。accept: 設(shè)置上載文件過濾，即點(diǎn)擊“瀏覽”按鈕時(shí)，只顯示指定文件類型的文件列表。 例如：<form name="myForm" method="POST" action="/custom/feedback.jsp" enctype="multipart/form-dat

53、a">提交論文：<input type="file" name="F1" size="20"></form>（9）表單提交當(dāng)表單填寫完畢后，需要選擇的submit/reset按鈕，它結(jié)束表單輸入，將表單數(shù)據(jù)傳送到服務(wù)器端，由表單<form>標(biāo)記中的action屬性指定的服務(wù)器上的程序處理用戶輸入數(shù)據(jù)。<input type=“submit”> 重填按鈕 表單清除就是要將表單中已做的輸入和選擇全部清除，重新填寫。<input type="reset"

54、;> 一般屬性：Name: 這和其它控件的屬性不同，在提交表單中，name可以指定一個(gè)函數(shù)，需要和form標(biāo)記中action屬性的程序配合。一般情況下，不需要name屬性。 value: 提交按鈕的顯示名字，一般為“確定”、“提交”等易于理解的名字。 Onclick: 事件屬性。 （10）表單button按鈕 在表單中除了使用有固定功能的提交、重置按鈕，還可以設(shè)置其他功能的按鈕，設(shè)置type的值為“button”，通過使用腳本確定按鈕的功能，此類按鈕無默認(rèn)功能。<input type=“button” name=“” value=“” onclick=“script”> 常用

55、屬性：name: 設(shè)置復(fù)選框的名稱，便于程序獲取用戶輸入value：顯示在按鈕上的文本。onclick ：用來設(shè)置該按鈕被單擊時(shí)激活腳本的名稱。 例如：<input type="button" value="階乘等于" name="equ" onClick="calcFact(n.value)“><input type="button" value="回前一頁(yè)" onclick="history.go( -1 );return true;">

56、 <input type="button" value="關(guān)閉窗口" onclick="window.close();return true在表單中還可以使用 “button”標(biāo)記，設(shè)置按鈕。<button type=“button|submit|reset” name=“” value=“” onclick=“script”> 按鈕顯示內(nèi)容</button >使用<button >標(biāo)記提供更為靈活的樣式定義。例如：<button name=“submit” value=“testbutton”&

57、gt; <img src=“submit.ico” width=32 height=32 ><br>提交</button >（11）標(biāo)簽<label>在表單中，有許多控件不帶顯示文本標(biāo)簽，如文本框、選擇框，<lable>標(biāo)記用來給這些控件添加標(biāo)簽。<label for= " control-id " > 標(biāo)簽文本</ label > 屬性for: 設(shè)置標(biāo)簽與表示的標(biāo)記關(guān)聯(lián)，其值為關(guān)聯(lián)標(biāo)記的識(shí)別標(biāo)志。例如：<form><input type=“checkbox" v

58、alue=“blue" name= " blue" checked id=“blue" >< label for= “ blue ” > 藍(lán)色</ label > <br><input type=“checkbox" value= " green" name= " green" id= " green" >< label for= “green ” > 綠色</ label > <br><i

59、nput type=“checkbox" value= " red" name= " red“ id= " red" >< label for= “ red ” > 紅色</ label ></form>（12）表單區(qū)域標(biāo)記 在表單中，對(duì)多個(gè)控件進(jìn)行分組，使頁(yè)面更具條理，<fieldset>標(biāo)記、 <legend>標(biāo)記用來實(shí)現(xiàn)表單的分區(qū)功能。<fieldset ><legend> 組標(biāo)記名稱</legend> 控件標(biāo)記</fie

60、ldset > 3.表單標(biāo)記的訪問控制控制tab鍵的順序 在表單中，多個(gè)控件的瀏覽順序，默認(rèn)的情況下是表單的書寫順序，若要更改默認(rèn)順序，可使用tabindex屬性。 tabindex屬性加入到控件標(biāo)記中，通過tabindex的屬性值的大小，改變默認(rèn)順序?？旖萱I accesskey屬性可以為控件提供定義快捷鍵，如accesskey=“n”，則用alt+n即可快捷訪問此控件表單控件的禁用和只讀 表單中，可以通過disable屬性將表單控件設(shè)為禁用，控件外觀為灰度顯示。disable屬性可用于<input> 、<select>、 <option>、 <

61、textarea>標(biāo)記。表單提交時(shí)，被禁用的屬性對(duì)將不提交。 表單中，可以通過readonly屬性將表單控件設(shè)為只讀，控件的內(nèi)容不能修改。例如：<input type=“text” name=“myaccount” size=“10” value=“guest” maxlength=“8” disable>控件提示 使用title屬性，可以給用戶提示，當(dāng)鼠標(biāo)指針移動(dòng)到控件上時(shí)，顯示提示文字。例如：<input type=“text” name=“myaccount” size=“10” value=“guest” maxlength=“8” title=“請(qǐng)輸入你的用戶

62、賬號(hào)”>（6） 層次塊標(biāo)記層次塊標(biāo)記<div></div>用于定義網(wǎng)頁(yè)上的一個(gè)矩形塊，中間可以包含引起行中斷的標(biāo)記，如<table>標(biāo)記等。層次塊標(biāo)記的一般形式是：<div id =" " style =" "></div> <div>標(biāo)記屬性Id: 用于標(biāo)記一個(gè)<div>塊，以便引用該塊。 style:<div>和<span>沒有默認(rèn)的顯示樣式 ，必須使用style屬性和class樣式類定義圖層塊的位置、大小、顯示屬性等。例如：style=

63、"width:100px;height:100px;overflow-x :hidden;overflow-y:hidden;"> 。 <span><span>在行內(nèi)定義一個(gè)區(qū)域，也就是一行內(nèi)可以被<span>劃分成好幾個(gè)區(qū)域，從而實(shí)現(xiàn)某種特定效果。和<div>標(biāo)記相比，<span>在CSS定義中屬于一個(gè)行內(nèi)元素，而<div>是塊級(jí)元素。 三、層疊樣式表CSS技術(shù) （一）Css的概念CSS是Cascading Style Sheets(層疊樣式表單)的簡(jiǎn)稱。1.樣式表 規(guī)范瀏覽器如何顯示

64、HTML特定標(biāo)記的一組規(guī)則。規(guī)則包括受樣式規(guī)則控制的標(biāo)記名稱，標(biāo)記的屬性兩部分。使用樣式表（1）內(nèi)部樣式表：樣式定義在HTML文檔中。內(nèi)聯(lián)樣式表：在應(yīng)用的HTML標(biāo)記中直接用style屬性插入樣式規(guī)則的方法。語法規(guī)則：<標(biāo)記名稱 style=“樣式屬性：屬性值；樣式屬性：屬性值；”>內(nèi)聯(lián)樣式的優(yōu)先級(jí)最高。嵌入式樣式表：在應(yīng)用的HTML內(nèi)部，在<head> 和</head>之間用標(biāo)記<style> 和</style>標(biāo)記對(duì)實(shí)現(xiàn)。語法規(guī)則： <style> 標(biāo)記名稱，標(biāo)記名稱標(biāo)記屬性：屬性值；樣式屬性：屬性值； </st

65、yle>（2）外部樣式表：將樣式定義存儲(chǔ)在獨(dú)立的樣式表文件中（擴(kuò)展名為.CSS）。輸入外部樣式表： 在應(yīng)用的HTML內(nèi)部，在<head> 和</head>之間用標(biāo)記<style> 和</style>標(biāo)記引入外部樣式表。語法規(guī)則： <style> <!- import url(“ 外部樣式表文件地址 ”);-></style>鏈接外部樣式表：在應(yīng)用的HTML內(nèi)部，在<head> 和</head>之間用標(biāo)記<link> 標(biāo)記鏈接到外部樣式文件。語法規(guī)則： <link type=“text/css” rel=“stylesheet” href=“外部