網站建設第六章

確定電子商務網站技術方案6.1網站技術方案認知6.2靜態網站技術6.3動態網站技術6.1網站技術方案認知

復習：網站建設的基本流程6.1網站技術方案認知網站技術方案的確定：1、網站服務器部署2、網站服務器軟件技術3、網站安全與兼容性措施6.1網站技術方案認知6.1.1網站服務器接入方式網站服務器接入有兩種選擇：①通過ISP接入專線，將網站部署在企業內部②使用IDC的服務方案，將服務器放在IDC機房6.1網站技術方案認知①專線接入，自建服務器

自建服務器可以自定相關配置，管理與維護很方便，但是企業需要自己購買機房，投入大量資金購買服務器、路由器、交換機等網絡設備，還要向ISP申請相應速率的DDN專線將服務器連在互聯網上。日常的維護還需要高水平的技術人員。優點：功能強大，適合大型企業缺點：成本高昂，進入市場時間長6.1網站技術方案認知②利用IDC提供的服務方案 IDC（InternetDataCenter）即互聯網數據中心，是基于互聯網為集中式收集、存儲、處理和發送數據的設備提供運行維護的設施基地，并提供相關的各項增值服務。

主要業務：主機托管、資源出租、系統維護、管理服務等6.1網站技術方案認知（1）主機托管

主機托管，即服務器托管，指用戶自卑服務器硬件，自己安裝軟件，放置到ISP的機房接入網絡，并委托ISP進行管理。

這種方法較經濟、快捷而且使用。一般的電信公司都會提供相關的主機托管服務。6.1網站技術方案認知（2）主機租用

該方法與主機托管區別不大，主要區別在于租用的主機產權歸于IDC，只是租給用戶使用

優點：成本較低，對網絡技術要求不高

適用范圍：規模較小的電子商務應用6.1網站技術方案認知（3）虛擬主機

虛擬主機是一種技術，使用特殊的軟硬件技術，把一臺運行在互聯網上的服務器主機分為多臺“虛擬”的主機，每個虛擬主機都具有獨立的域名和IP地址，具有完整的互聯網服務功能，主機之間也是相互獨立的。

優點：成本低，進入市場及時

缺點：靈活性差

適用范圍：適合中小型的網站采用6.1網站技術方案認知三種接入方式的比較P1106.1網站技術方案認知評測數據中心的性能：（1）收集資料，了解數據中心的出口帶寬（2）服務器部署在接近目標用戶的IDC機房（3）通過顯示路由和測試速度的軟件比較優劣

①Ping命令

②使用路由測試系統和速度測試系統6.1網站技術方案認知6.1.2網站服務器軟件技術決策

網站服務器軟件技術決策主要包括操作系統、WEB服務器軟件、網站開發語言、數據庫系統的選用與確定

1、網絡操作系統

網絡操作系統主要有：Unix、Linux、Windows。是選用Unix、Linux還是Windows，要分析開發習慣、穩定性、安全性和投入成本等因素來決定需要用到的操作系統。6.1網站技術方案認知Windows系統優點：操作簡便、配置和管理服務器容易上手缺點：正版費用高昂，硬件配置要求高Linux系統優點：開源、全免費、安全性能好、免費軟件豐富缺點：操作復雜，需要專門的技術人員進行維護如果有專門的技術人員維護，可以考慮使用Linux系統，配合PHP或JSP和Mysql數據庫。對于一般的企業，用Windows即可，可以降低維護成本和更新難度6.1網站技術方案認知2、網站服務器軟件

網站服務器即Web服務器，也稱為HTTP服務器，指網絡上安裝HTTP服務器軟件開啟了HTTP服務的計算機。HTTP協議（HyperTextTransferProtocol，超文本傳輸協議）是用于從WWW服務器傳輸超文本到本地瀏覽器的傳輸協議。它可以使瀏覽器更加高效，使網絡傳輸減少。它不僅保證計算機正確快速地傳輸超文本文檔，還確定傳輸文檔中的哪一部分，以及哪部分內容首先顯示(如文本先于圖形)等。6.1網站技術方案認知常用的HTTP服務器軟件：IIS、Apache、Tomcat等IIS：互聯網信息服務，是微軟公司提供的文件和應用程序服務器，在Windows平臺上建立互聯網服務器的基本組建，但只能在Windows系統下運行Apache：ApacheHTTPServer，是一個開源的網站服務器軟件系統，可以在大多數操作系統中運行，是最流行的Web服務器端軟件之一Tomact：免費開源的輕量級Web應用服務器，是開發和調試JSP程序的首選6.1網站技術方案認知3、網站開發語言的選擇常用的開發語言：ASP、ASP.NET、PHP、JSP等①ASP-簡單易用的過氣應用 ASP即ActiveServerPages，是微軟開發的類似HTML、Script（腳本）與CGI（公用網關接口）的結合體，它沒有提供專門的編程語言，而是允許用戶使用已有的腳本語言編寫ASP應用程序。6.1網站技術方案認知優點：包含HTML標簽，可以直接存取數據庫，可以使用無線擴充的ActiveX控件缺點：局限于Windows+IIS操作平臺，無法實現跨平臺；沒有獨立的存放位置，容易受到外部攻擊，安全性很低TIPS：ActiveX是一個開放的集成平臺，為開發人員、用戶和Web生產商提供了一個快速而簡便的在Internet和Intranet創建程序集成和內容的方法。使用ActiveX,可輕松方便的在Web頁中插入多媒體效果、交互式對象、以及復雜程序，創建用戶體驗相當的高質量多媒體CD-ROM。6.1網站技術方案認知②ASP.NET-易學難精的優秀語言 ASP.NET是.NET技術的一部分，是ASP的升級版，采用VB或C#作為基礎語言。語法上很大程度與ASP兼容，但語言架構和特點有很大區別優點：可生成伸縮和穩定性高的應用程序；提供很好的安全保護；設計簡潔；語言靈活；支持面向對象缺點：易學難精；連接數據庫有些復雜典型案例：京東商城、當當商城、CSDN社區6.1網站技術方案認知③JSP-大有前途的語言

JSP即JavaServerPages，由SunMicrosystems公司倡導的一種動態網頁技術標準

優點：

1）效率和安全性高

2）組件方式方便，實現了模塊化

3）JSP的適應平臺更廣

缺點：開發速度慢；學習比較困難；開發成本昂貴6.1網站技術方案認知④PHP-開源流行的實用語言

PHP即HypertextPreprocessor（超文本預處理器），是一種跨平臺的服務器內嵌式的腳本語言，這種語言混合了C、Java、PERL等語言和PHP自身獨特的語法，只需要很少的編程知識就可以創建一個網站站點

優點：

1）與HTML有很好的兼容性

2）提供了標準的數據庫接口

3）兼容性強，擴展性強，可進行面向對象編程6.1網站技術方案認知缺點：1）函數名無法統一，移植很麻煩2）安裝復雜3）缺少正規的商業支持，無法實現商業品化應用的開發6.1網站技術方案認知

這四種技術各有特色，在選擇那種技術取決于網絡服務器所采用的系統。使用微軟的系統，那么選擇ASP或ASP.NET較為合適

選用Linux系統，運用PHP或者JSP更好一些盡量選擇熟悉的語言和操作系統，不要使用自己不熟悉的技術6.1網站技術方案認知

四種開發環境的比較P1166.1網站技術方案認知一些固定的服務器軟件搭配組合模式：Windows+IIS+access+aspWindows+IIS+sqlserver+Linux+Tomcat+Mysql+JspLinux+Apache+Mysql+PHP6.1網站技術方案認知4、網站數據庫系統的選用網站數據庫系統主要有：Microsoftsqlserver、IBMDB2.oracle、Access、mysql等。小型網站可選用Access或mysql數據庫，中型網站用SQLServer或Mysql，大型網站則使用DB2或oracle6.1網站技術方案認知5、動態域名解析服務

該技術是將一個特定的域名和上網電腦當前的IP對應，當電腦上網時就定時刷新域名所對應的IP，是用戶能轉向該電腦使用的IP。

這種技術主要用于使用動態IP寬帶上網的電腦作為服務器的企業，可以非常大的降低服務器成本。6.1網站技術方案認知6.1.3網站安全問題（一）網站安全威脅的來源

1、服務器重要信息泄露 2、服務器軟件或硬件受到破壞

3、瀏覽器與服務器之間的會話信息被竊聽和偽造

4、服務器的安全漏洞

①操作系統的漏洞

②服務器軟件的安全隱患

③服務器腳本程序的漏洞6.1網站技術方案認知（二）網站安全防范

1、防止SQL注入

（1）查詢語言使用數據庫提供的參數化查詢接口

（2）對進入數據庫的特殊字符進行轉義處理，或編碼轉換

（3）確認每種數據的類型，比如數字型的數據必須是數字，數據庫中存儲字段必須是int

（4）數據長度嚴格規定，防止比較長的SQL注入語句無法正確執行

（5）網站每個數據層的編碼統一，推薦UTF-8編碼6.1網站技術方案認知（6）嚴格限制網站用戶的數據庫操作權限，只需提供能夠滿足工作的權限即可（7）避免網站顯示SQL錯誤信息，防止攻擊者利用信息進行判斷（8）在發布之前建議使用專業SQL注入檢測工具進行檢測6.1網站技術方案認知2、防止掛馬攻擊

掛馬：掛馬就是黑客利用網站漏洞修改網頁內容，使訪問者在進入網站時自動跳轉到指定的網站或下載木馬病毒（1）數據庫掛馬：攻擊者利用SQL注入漏洞將掛馬代碼注入數據庫某些字段中，因此需要及時清理數據庫，包括恢復數據庫或利用掛馬代碼搜索數據庫（2）文件掛馬：攻擊者直接將掛碼代碼批量寫入服務端文件達到整站掛馬的目的，使用工具或命令遍歷網站的文本文件來清除掛碼代碼6.1網站技術方案認知（3）ARP掛馬：在同一局域網的情況下，攻擊者可以通過ARP欺騙，將掛碼代碼注入用戶請求的響應頁面。需要及時查找出ARP病毒，并將相應計算機進行安全加固（4）服務端配置文件掛馬：使用IIS里的文件重定向、啟用文檔頁腳、修改IIS映射等行為掛馬，該技巧比較常用，因此需要隨時注意配置文件是否異常6.1網站技術方案認知3、防止敏感信息泄露

企業內部有很多重要的信息，為了防止這類敏感信息泄露，需要確認

①網站上的文檔是否符合公司的安全策略

②是否對公司規定的信息安全等級相對應

③網站上的文檔確實是可以訪問和閱讀的

④使用安全刪除軟件將包含敏感信息的文檔徹底刪除6.2靜態網站技術6.2.1靜態網站認知HTML（HyperText

MarkupLanguage）即超文本標記語言，是萬維網（WWW）的描述語言。他不是編程語言，而是用于描述或標記網頁元素以及頁面的連結信息。純粹用HTML編寫的網頁稱為靜態網頁，文件通常以htm、html、shtml、xml為后綴。當然，HTML網頁上也可以出現動態效果，如gif動畫，flash動畫，滾動字符等。6.2靜態網站技術靜態網站特點：（1）存取速度比動態網頁快（2）內容相對穩定，容易被搜索引擎檢索（3）獨立于各種操作系統平臺（4）沒有數據庫的支持，難以對信息數據進行管理（5）信息單向傳播，缺少交互性6.2靜態網站技術靜態網站訪問機制：

用戶通過瀏覽器向網站服務器請求網頁時，網站服務器通過HTTP協議直接將純粹的HTML文檔傳送給客戶端服務器，HTML文件中的網頁元素及程序、插件等在服務器端解釋和執行。6.2靜態網站技術6.2.2靜態網站技術方案

靜態網站相對穩定，更受搜索引擎青睞。因此企業常使用靜態網站技術來使網站排名靠前，主要的實現途徑有：

①編寫純靜態頁面

②靜態化

③偽靜態6.2靜態網站技術①編寫純靜態頁面獲得純靜態頁面的途徑是使用網頁制作工具手工編寫，生成HTML文檔，也可以利用格式轉換工具，將word或excel等文檔轉換為HTML文檔網頁制作工具主要是各種文本編輯器或其他html編輯工具。一類是HTML源代碼編輯軟件，如notepad++、editplus等，這類軟件只要掌握HTML的語法就能制作網頁另一類是即刻產生效果的軟件，如FrontPage和Dreamweaver，這類軟件不一定要了解語法，可以由軟件自行生成代碼6.2靜態網站技術②靜態化由于搜索引擎的需要，常常把動態網頁轉換為靜態網頁。在處理方法上，有靜態化和偽靜態之分靜態化：將網站的動態信息和彼此之間的關系存入數據庫，根據特定的規則和模板生成網站的靜態頁面，以靜態形式發布原來的動態信息6.2靜態網站技術③偽靜態（Url靜態化）偽靜態不是真正意義上的靜態化，它只是利用某種方法將訪問的路徑也就是url地址轉換為html后綴。常用的方法有兩個：利用錯誤處理機制利用URL重寫技術6.2靜態網站技術錯誤處理機制

用IIS的404錯誤處理機制來實現偽靜態要不rewrite靈活的的多，原理就是輸入不存在的網頁，觸發404錯誤頁，瀏覽器就會轉向首頁或錯誤處理頁面，在錯誤處理頁面中設置了頁面顯示信息然后輸出在頁面中就完成了偽靜態化6.2靜態網站技術偽靜態化的缺點：①CPU占用量大②網頁打開慢③大量的重復頁面④部分服務器不支持偽靜態化⑤造成真正的靜態網頁無法訪問6.2靜態網站技術網站技術方案的選擇（1）靜態網站主要是為了搜索引擎的引用，靜態和偽靜態都可以被搜索引擎引用，但是純靜態性能更好，減少CPU和內存的壓力，所以能用靜態就不要用偽靜態（2）使用偽靜態會增加CPU占有率，因此不要大量食用，只需在專門提供給搜索引擎引用的頁面中使用即可（3）不適合純靜態發布數據信息的時候使用偽靜態。純靜態只適合圖片文字等信息的發布，需要動態頁面的時候就可以使用偽靜態6.3動態網站技術6.3.1動態網站的認知

1、動態網站概述網頁文檔中的程序在服務器端運行是動態網頁的重要標志。動態網頁是插入了腳本程序的網頁，這些程序。組件在服務器端運行，根據不同的用戶、不同的時間返回不同的頁面。常見的動態頁面后綴為asp、aspx、php、jsp等。動態網站的網頁不是所有都是動態網頁，大多數都是靜態與動態的混合網頁6.3動態網站技術2、動態網站的特點：（1）交互性（2）自動更新（3）因事因人而變（4）常常有數據庫的支持（5）動態信息容易管理動態網頁和靜態網頁各有特點，選擇哪種主要看功能需求和網站內容的多少6.3動態網站技術3、動態網頁訪問機制動態網頁文件放在服務器上，用戶訪問時，在瀏覽器地址欄中輸入網址，服務器接收到請求先將頁面內的腳本程序在服務器端運行之后，再生成相應的html頁面傳給瀏覽器，瀏覽器接收到頁面之后將html內容顯示出來6.3動態網站技術4、動態網站建站方案（1）定制建站，根據客戶需求來定制化開發網站（2）采用CMS建站。使用網站半成品提高建站速度（3）自助建站。網站功能模塊已經做成模板，只需要簡單的設置就可以完成建站（4）使用網站成品，即購買網站6.3動態網站技術6.3.2定制建站方案1、定制建站的含義定制建站就是傳統建站，即企業找到技術人員或者專業公司按照企業的要求通過編寫代碼來制作網站，包括網站策劃、網頁設計、程序開發、注冊域名、租用主機、上傳網站、發布網站等建站全過程。需要一定的開發周期，成本較高，需要各種技術人員定制建站一般有兩種方案：自主開發建造和委托專業公司開發建站6.3動態網站技術2、采用定制建站方案的考慮因素

（1）有網站的定制需求

定制建站可以根據企業的要去進行定制，網頁也可以任意修改直到滿意，因此有定制需求是定制建站的前提

（2）有網站建設的技術人才

自助開發建站的企業必須有網站策劃、網站美工和程序員來配合完成網站建設工作，后期維護也需要相關技術人才

（3）愿意承擔網站建設和維護成本

除了域名、主機空間等方面的費用外，定制建站主要的成本來自技術人才，即使委托建站公司建站可以降低相關費用，但后續的更新于推廣仍然需要費用6.3動態網站技術3、如何選擇定制建站公司

基于成本和技術人員的考慮，很多企業會選擇委托專業公司建站。因此選擇專業的公司就很重要，需要考慮幾點因素：①公司歷史

網站設計和開發是技術活，沒有一定的經驗年限是很難表現出專業的水準的6.3動態網站技術②公司業務專業方向

每個公司所精通的業務不一樣，幾乎每個網絡公司都在開展網站建設業務，只是網站業務占公司總業務比重不同。有搞網站建設的，有做百度、谷歌搜索引擎營銷的，有賣域名空間的，現在相對正規做網站建設的公司主要有下面幾種：

1）主營域名注冊/網站空間/企業郵箱的網絡公司，網站建設是企業的一小塊業務

2）主營平面廣告/多媒體廣告的廣告公司，主要是做平面廣告設計的，網站建設也是一小塊業務6.3動態網站技術

3）主營軟件開發的軟件公司，主要業務是軟件開發，有部分軟件公司精通Web的軟件開發業務，因此在選擇的時候需要注意主營方向 4）以網站建設為主營業務的建站公司。6.3動態網站技術③公司案例可以通過公司過去設計開發的網站案例來判斷該公司的技術水平④公司團隊一個優秀的網站建設公司，需要一個優秀的有經驗的網站制作團隊，新手是無法完成一個優秀的網站建設任務的⑤搜索引擎上用戶的投訴歷史記錄類似于淘寶的評價系統，在搜索引擎上可以搜索到客戶的一些反饋信息，⑥價格因素6.3動態網站技術4、定制建站的一般流程（1）客戶提出需求（2）提供建設方案（3）查詢申辦域名（4）簽訂合同（5）組建項目小組（6）頁面設計（7）技術合成（8）上傳測試6.3動態網站技術（9）網站開通（10）網站推廣（11）培訓和維護（12）售后服務6.3動態網站技術6.3.3CMS建站方案1、CMS建站概述（1）CMS含義 CMS即內容管理系統，是一種位于網站前端和網站后端的應用系統、辦公系統或流程之間的軟件系統。通常指門戶或商業網站發布和管理系統，也可以指新聞發布網站、維基百科、個人網站系統和博客6.3動態網站技術CMS主要有三大應用領域：1、政府和企業的內部信息門戶和知識系統2、網站內容管理3、全文搜索6.3動態網站技術CMS本質是一種建站工具，提供了建站的網頁模板、功能模板、建站導航等功能，用戶可使用它來搭建自己的網站。CMS只能算是一個建站的半成品，它將框架和后臺系統搭建好，然而仍然需要填充內容6.3動態網站技術CMS的類型：①框架型：只提供底層框架，不包含應用實現，需要二次開發②應用型：本身已是一個已實現功能的應用系統，企業和用戶只需要根據需要增刪或修改模板即可構建一個自己的網站6.3動態網站技術6.3.4自助建站方案1、自助建站概述（1）自助建站的意義自助建站一般是自助建站服務公司將已經做好的網站成品傳到網絡空間上，然后客戶登錄到服務器在線公用平臺，選擇滿意的模板快速生成簡單的動態網站。6.3動態網站技術（2）自助建站的特點①使用成品網站模板②即買即開通，操作簡便③建站周期大大縮短④成本大大降低6.3動態網站技術（3）自助建站的劣勢①缺乏個性，功能簡單②不能自由地移植③不能靈活的擴展功能④不能隨意的編輯模板6.3動態網站技術2、自助建站的流程（1）注冊會員（2）生成網站（3）后臺管理6.3動態網站技術6.3.5成品網站建站方案1、成品網站建站方案概述成品網站是通過對網站的細分研究，由專業人員經過精心策劃、設計和制作，做好大量現成的網站，在網站超時打包出售。用戶可以直接將成品網站安裝到服務器上6.3動態網站技術2、成品網站的建站流程（1）購買成品網站安裝程序（2）軟件授權：提供要綁定的域名給商家來授權（3）安裝：可自行安裝也可由商家幫助安裝。自行安裝則由商家發送授權碼給用戶，商家安裝則需要提供網站空間的賬號密碼等由他們安裝第七章

電子商務的網站建設7.1靜態網頁制作7.2HTML語言7.3動態網頁制作7.1靜態網頁制作7.1.1基礎知識介紹1、工作環境 DreamweaverCS5是一款較新的靜態網頁制作軟件，先從操作界面進行一些熟悉7.1靜態網頁制作這是Dreamweaver的啟動畫面7.1靜態網頁制作在圈中的區域單擊即可創建相應類型的文件7.1靜態網頁制作7.1靜態網頁制作2、網站的創建與管理一般來說，制作網站的第一步是確定本地站點的目錄結構，并準備好相應的素材文件，然后再Dreamweaver中定義站點并創建網頁，具體操作步驟：7.1靜態網頁制作（1）確定站點的目錄結構站點的目錄結構對于以后網站的管理和維護是非常重要的，因此在創建網頁之前，先要確定好站點的而目錄結構，主要包含兩個重要任務：①在本地磁盤上創建用來保存網站內容的文件夾，該文件夾稱為站點文件夾②還要在站點文件夾中創建不同的子文件夾，以存放不同類型的文件，如：圖片放在image文件夾，flash動畫放在flash文件夾，樣式文件放在css文件夾，名字都可以自己取，只要能區分開就行7.1靜態網頁制作7.1靜態網頁制作上圖就是一個典型的站點文件夾內容，包括了css、image、flash、js四個子文件夾，還有若干個網頁文件在開始制作網頁前最好將所有的素材都放進相應的子文件夾中，特別是圖片、flash動畫等資源，方便之后的調用在創建網頁之前，先要定義好站點，主要包括設置站點名稱、站點性質以及站點對應的文件夾7.1靜態網頁制作具體案例：先在自己的磁盤上創建一個名為“恒威管業”的文件夾，作為站點的根文件夾，并且在文件夾的下面先準備好子文件夾，將用到的圖片、flash動畫等資源放入分好類的文件夾中7.1靜態網頁制作7.1靜態網頁制作站點創建步驟：第一步：選擇新建站點7.1靜態網頁制作第二步：點擊右側的文件夾圖標，選擇創建的文件夾7.1靜態網頁制作第三步：將站點名字改為恒威管業7.1靜態網頁制作第四步：點擊保存，可以看到站點出現在了左下角7.1靜態網頁制作如果出現需要新的文件夾或者文件時，很簡單，直接在右下角點擊右鍵，新建即可7.1靜態網頁制作可以看到，點擊新建文件會自動新建一個html文件在根目錄下，用戶取名字即可7.1靜態網頁制作3、網頁文檔的基本操作（1）新建網頁方法一：選擇文件->新建7.1靜態網頁制作7.1靜態網頁制作7.1靜態網頁制作創建好之后點擊保存7.1靜態網頁制作保存在站點目錄下，取上適當的名字即可7.1靜態網頁制作方法二：直接在首頁點擊html即可7.1靜態網頁制作然后進行保存操作即可7.1靜態網頁制作方法三：前面提到的直接在站點文件點擊右鍵新建即可7.1靜態網頁制作取名之后雙擊即可打開7.1靜態網頁制作（2）預覽網頁編輯網頁之后可以進行網頁的預覽，第一種方法是直接在右側進行預覽，但是為了適合瀏覽器的兼容性，一般通過瀏覽器來預覽，有兩種方式：①單擊工具欄的按鈕，選擇在不同的瀏覽器進行預覽7.1靜態網頁制作7.1靜態網頁制作②直接按F12會自動使用默認瀏覽器打開當前網頁7.1靜態網頁制作4、網頁基本頁面屬性設置（1）選擇修改->頁面屬性命令7.1靜態網頁制作也可以單擊屬性面板的頁面屬性按鈕或者使用Ctrl+J的快捷鍵7.1靜態網頁制作在彈出的對話框中設置整個文檔的信息，在“外觀”選項中可以設置頁面的一些基本屬性，包括字體，大小，文本顏色，背景顏色等7.1靜態網頁制作（2）“鏈接”選項中可以設置與頁面鏈接有關的屬性7.1靜態網頁制作（3）標題選項中可以設置與標題相關的字體，顏色等7.1靜態網頁制作（4）標題/編碼選項主要設置的是文字的編碼7.1靜態網頁制作（5）跟蹤圖像可以設置跟蹤圖像的屬性，跟蹤圖像是在網頁已經由PS畫好之后可以作為背景放在頁面后面，然后制作網頁的時候可以根據背景進行網頁的排版7.1靜態網頁制作5、網頁文件的命名規則（1）所有文件名使用英文小寫，不要用大寫字母（2）不要使用中文命名（3）不要再文件名中加空格，如果需要隔開可以使用下劃線“_”（4）運算符符號不能用在文件名開頭7.1靜態網頁制作7.1.2網頁內容的編輯1、在網頁中插入文本文本是網頁中不可或缺的一部分，無論什么網頁，都需要在網頁中添加文本來傳達信息。在Dreamweaver中輸入文本的方法非常簡單，只需要在光標定位的位置輸入文字即可，也可以進行復制粘貼后設置各種格式和屬性注：Dreamweaver中分段是按“Enter”鍵，換行是按“Shift+Enter”7.1靜態網頁制作7.1靜態網頁制作設置文本段落和字符格式：利用屬性面板為文本和段落格式設置不同的樣式，具體方法為：選中要設置的文本，打開屬性面板，進行相關的設置，類似于word文檔處理7.1靜態網頁制作7.1靜態網頁制作7.1靜態網頁制作用戶也能在軟件下方直接進入屬性的設置7.1靜態網頁制作練習1：在網頁中輸入文本，設置字體為“Arial,Helvetica,sans-serif”，字體大小為18px，文本顏色為黃色7.1靜態網頁制作2、在網頁中插入水平線網頁中插入水平線可以很方便的對內容進行分塊，區域進行分區插入水平線有兩種方法7.1靜態網頁制作方法一：選擇插入->HTML->水平線7.1靜態網頁制作方法二：在插入欄中選擇水平線按鈕即可7.1靜態網頁制作7.1靜態網頁制作修改水平線屬性：如果對水平線的高度和寬度有要求，可以直接進行修改，在軟件的下方7.1靜態網頁制作修改水平線顏色：如果需要對水平線顏色進行修改則不能直接進行設置，需要在左邊的代碼區進行代碼的添加，即在水平線的標簽中輸入“color=”等號后面填上顏色代碼7.1靜態網頁制作7.1靜態網頁制作填寫完代碼之后，預覽中的水平線并不會改變顏色，必須打開瀏覽器才能看到變化7.1靜態網頁制作7.1靜態網頁制作除了上述的更改方法，還可以點擊左下角的“快速標簽編輯器”進行更改7.1靜態網頁制作7.1靜態網頁制作練習2：在段落中間加一條水平線，設置長度為700，寬度5，顏色為紅色7.1靜態網頁制作知識補充：（1）標簽：即HTML標簽，是WWW的描述語言。一個標簽由開始標簽和結束標簽搭配使用，中間放入內容和描述性用語例如：<p>這是一段話</p>這在瀏覽器中只會顯示中間的中文，兩邊的是描述性語言，表示中間這句話是一個段落7.1靜態網頁制作在標簽中也可以加入描述性用語，用來規定標簽的顯示狀態，主要的描述性用語有：border=“”;調整邊框的寬度color=“”;調整顏色width=“”;調整寬度height=“”;調整高度因此一般可以對顯示的文字進行各種調整，如：<p><fontsize=“15px”color=“red”>這是一段話<font></p>7.1靜態網頁制作7.1靜態網頁制作常用的標簽主要有：<html></html>:html文件必須要有的標簽<body></body>:html文件的主體內容<head></head>:頭文件內容，一般放入標題和一些說明<p></p>:表示一個段落<font></font>:對字體進行設置<table></table>:制作一個表格7.1靜態網頁制作（2）顏色代碼當我們需要對字體或者背景以及其他設置顏色的時候需要對顏色的代碼有個了解，因為需要相應的代碼才能顯示相應的顏色。每一種顏色都對應了相應的代碼，一般人是無法記住的，在Dreamweaver中可以對代碼進行一個查找7.1靜態網頁制作首先，打開頁面屬性7.1靜態網頁制作點開外觀（HTML），點擊背景，選擇需要的顏色即可在上方顯示顏色代碼7.1靜態網頁制作將我們需要的顏色代碼寫入相應的屬性中就行了，注意“#”也要寫進去7.1靜態網頁制作在瀏覽器中打開后，就可以看到顏色的變化了7.1靜態網頁制作如果是使用我們常用的顏色，有些可以不需要代碼，直接用英文即可：red-紅色blue-藍色gray-灰色yellow-黃色green-綠色white-白色black-黑色7.1靜態網頁制作7.1靜態網頁制作任務：1、創建“恒威管業”站點，包括“恒威管業”主目錄，下設“image”“flash”“css”“js”“video”子目錄，創建一個新的網頁文件“index.html”2、在網頁中插入文本，按照圖片中的文本進行填寫3、按照圖片中的樣子插入水平線并修改顏色為綠色，需要以填寫顏色代碼的形式插入4、設置字體為“Arial,Helvetica,sans-serif”，字體大小為18px，文本顏色為黃色，背景顏色為天藍色7.1靜態網頁制作3、在網頁中插入圖像和動畫圖像和動畫是網頁中不可或缺的一部分，恰當的使用圖像和動畫可以使網頁變得更加賞心悅目，便于閱讀，從而使更多的訪問者愿意訪問網站（1）插入圖片的方法很簡單，在插入欄中點擊圖像按鈕，選擇要插入的圖片確定即可7.1靜態網頁制作點擊圖像按鈕7.1靜態網頁制作選擇需要插入的圖片點擊確定7.1靜態網頁制作7.1靜態網頁制作注意：在插入圖片時，如果所選圖片不在站點文件夾內，系統會提示是否將其復制在站點文件夾中，一般選擇“是”，否則會導致網站用到站點外的圖片，用瀏覽器打開是不會顯示圖片的7.1靜態網頁制作練習3：在網頁頂部插入LOGO圖片7.1靜態網頁制作（2）插入Flash動畫Flash動畫是目前最為流行的矢量動畫，它的文件小、變化豐富，很多網頁都是用Flash動畫來展示更多的內容插入方法：在插入欄中點擊“媒體：SWF”按鈕，在選項框中選擇一個flash文件點擊確定即可7.1靜態網頁制作點擊媒體：SWF按鈕7.1靜態網頁制作選擇需要插入的Flash動畫7.1靜態網頁制作點擊確認即可7.1靜態網頁制作需要在瀏覽器中進行預覽7.1靜態網頁制作練習4：在LOGO下面插入Flash動畫7.1靜態網頁制作4、插入超級鏈接“鏈接”是網站中必備的部分，是通向其他網頁文件以及其他網站的方法。通過鏈接我們可以跳轉到不同的網頁或進行其他的操作。設置鏈接的方法有很多種，最簡單的就是在“屬性”面板上的“鏈接”文本框中直接輸入要鏈接的文件地址超鏈接一般分為三種：常規連接、圖片鏈接和熱點鏈接7.1靜態網頁制作（1）常規鏈接常規鏈接包括內部鏈接和外部鏈接內部鏈接指站點內部寫好的頁面外部鏈接則是跳轉到其他網站內的網頁7.1靜態網頁制作①內部鏈接內部鏈接的設置很方便，選中要設置鏈接的文本或圖像后，可以在屬性面板的“鏈接”文本框中直接輸入要連接到的網址或網頁名稱；也可通過單擊“屬性”面板上“鏈接”文本框后的文件夾圖標選擇7.1靜態網頁制作方法一：選擇需要變成鏈接的文字，在選項框中寫入鏈接名稱7.1靜態網頁制作方法二：點擊鏈接框后面的文件夾按鈕7.1靜態網頁制作選擇需要的文件點擊確定即可7.1靜態網頁制作方法三：直接將鏈接框后面的“指向文件”按鈕拖拽到需要鏈接的文件即可7.1靜態網頁制作鏈接下方還有一個“目標”的下拉菜單，有五個選項：_blank:點擊鏈接打開新的窗口，始終在另一個新窗口_new:點擊鏈接打開新的窗口，始終在同一個新窗口_parent:在當前窗口顯示被打開的窗口_self:在當前窗口顯示被打開的窗口_top:在當前窗口顯示被打開的窗口7.1靜態網頁制作練習5：在網頁最下方插入一個超鏈接名為“內部鏈接”，指向新建的一個網頁文件名為“news.html”7.1靜態網頁制作②外部鏈接外部鏈接只能在“鏈接”框中輸入網址，注意要寫全網址，包括http7.1靜態網頁制作練習6：在內部鏈接下一行創建一個名為“百度”的外部鏈接，指向百度首頁，即7.1靜態網頁制作（2）圖片鏈接圖片鏈接的設置與普通鏈接一樣，只是文本鏈接是框選文本，而圖片鏈接是選擇圖片，其余操作是完全一致的7.1靜態網頁制作（3）熱點鏈接之前說到圖片鏈接，只能為圖片設置一種鏈接，現在如果需要為一個圖片設置多個鏈接的時候就需要用到熱點鏈接具體步驟如下：7.1靜態網頁制作①選中需要設置的圖片，在屬性面板點擊熱點工具，一般選擇矩形7.1靜態網頁制作②在圖片上“首頁”區域，繪制一個矩形區域7.1靜態網頁制作③在屬性面板設置鏈接7.1靜態網頁制作④繼續在下一個菜單框選,并重復上述操作7.1靜態網頁制作任務：1、創建兩個新網頁文件turn.html和news.html2、插入LOGO圖片3、插入Flash圖片4、設置LOGO圖片的超鏈接為5、把菜單欄圖片設置為熱點鏈接，“首頁”指向index.html，“關于我們”指向turn.html，新聞中心指向“news.html”，全部以打開新窗口的方式打開6、在turn.html中加入一句話：“這是一個內部鏈接跳轉文件”7.1靜態網頁制作三、利用表格布局網頁（一）創建表格表格是由一個或多個單元格構成的集合，表格中橫向的多個單元格稱為行（以<tr></tr>標簽表示），垂直的稱為列（以<td></td>標簽表示）。表格的建立可以很好的將網頁中的元素整齊地擺放在中間而不會出現凌亂的現象7.1靜態網頁制作1、創建表格Dreamweaver中提供了很方便的創建表格的方法，點擊“插入”點擊“表格”即可7.1靜態網頁制作也可以在快捷插入欄點擊表格的快捷鍵7.1靜態網頁制作設置各項參數之后點擊創建即可7.1靜態網頁制作下面對設置的屬性進行說明：①行數和列數：即需要插入幾行幾列的表格，輸入相應的數字即可②表格寬度：如果不設置表格寬度就會根據內容自行調整，輸入則固定寬度。像素是顯示器的顯示基本單位，百分比則是相對于瀏覽器的，瀏覽器大小變化也會導致表格發生變化③邊框粗細：表格邊框的粗細，一般用于調整表格④單元格邊距：也叫單元格填充，指內容與邊框的距離⑤單元格間距：值單元格之間的距離7.1靜態網頁制作選擇單元格：與Excel的操作類似，按住Ctrl加鼠標點擊即可，或者使用鼠標拖拽7.1靜態網頁制作（二）表格和單元格屬性設置選擇表格后，在屬性面板有很多屬性可以進行設置7.1靜態網頁制作①水平：設置單元格內容水平擺放方法，有左對齊，居中和右對齊三種②垂直：設置單元格內容垂直擺放方法，有頂端、居中、底部、基線四種③寬、高：設置單元格的寬和高④背景顏色：設置單元格的背景顏色7.1