網(wǎng)站建設(shè)實驗_第1頁
網(wǎng)站建設(shè)實驗_第2頁
網(wǎng)站建設(shè)實驗_第3頁
網(wǎng)站建設(shè)實驗_第4頁
網(wǎng)站建設(shè)實驗_第5頁
已閱讀5頁，還剩3頁未讀， 繼續(xù)免費閱讀

下載本文檔

版權(quán)說明：本文檔由用戶提供并上傳，收益歸屬內(nèi)容提供方，若內(nèi)容存在侵權(quán)，請進行舉報或認領(lǐng)

文檔簡介

試驗報告依據(jù)如下試驗指導(dǎo)書寫，也可以自己設(shè)計，寫的時候下面代碼不必全寫試驗一IIS服務(wù)器安裝及WEB站點和FTP站點的配置一、試驗?zāi)康募耙?．駕馭Windows2000/XP服務(wù)器上IIS（Internet服務(wù)管理器）的安裝與配置；2．了解并駕馭虛擬書目的概念和設(shè)置方法；二、試驗內(nèi)容1．課下在自己的個人計算機上安裝IIS；2．配置web站點和ftp站點3．分別在兩個站點建立虛擬書目并訪問三、試驗過程（一）IIS的安裝與配置ASP必需運行在服務(wù)器上，因此試驗的第一項工作是構(gòu)建服務(wù)器運行環(huán)境。本試驗指導(dǎo)以WindowsXP操作系統(tǒng)下的IIS5.0進行操作說明。1．安裝IIS起先－>限制面板－>添加刪除程序－>添加/刪除Windows組件－>Windows組件向?qū)?，則出現(xiàn)如下對話框：選取IIS信息服務(wù)（IIS），選擇點具體信息，勾上FTP那一項，并點按“下一步”按鈕，按屏幕提示安裝。2．檢驗安裝在IE閱讀器的地址欄輸入：://localhost，://，或://計算機名，視察其結(jié)果。（二）、配置WEB站點和FTP站點起先－>限制面板－>管理工具－>Internet服務(wù)管理器，打開IIS管理器對“默認網(wǎng)站”單擊鼠標右鍵，出現(xiàn)彈出菜單，選擇“屬性”，則屏幕顯示如上，可依據(jù)須要修改默認網(wǎng)站的屬性，一般多為“主書目”關(guān)于和“文檔”，在主書目中對網(wǎng)站在本地機器中的實際路徑以及相關(guān)權(quán)限的設(shè)置；文檔則設(shè)置網(wǎng)站啟用的默認文檔等。同樣對下面的FTP站點，對“默認FTP站點”單擊鼠標右鍵，出現(xiàn)彈出菜單，操作類似WEB站點配置。（三）、虛擬書目的設(shè)置要從主書目以外的其他書目中進行發(fā)布，就必需創(chuàng)建虛擬書目。“虛擬書目”可以不包含在主書目中，但在顯示給客戶閱讀器時就象位于主書目中一樣。虛擬書目有一個“別名”，供Web閱讀器用于訪問此書目。別名通常要比書目的路徑名短，便于用戶輸入。運用別名更平安，因為用戶不知道文件是否真的存在于服務(wù)器上，所以便無法運用這些信息來修改文件。1．在硬盤上創(chuàng)建一個實際書目：d:\temp2．為d:\temp創(chuàng)建虛擬書目在“Internet信息服務(wù)”窗口，在“默認網(wǎng)站”單擊鼠標右鍵，選擇“新建”－>“虛擬書目”，按提示操作分別設(shè)置虛擬書目別名（例如：tmp）、實際的書目路徑（例：d:\temp）以及虛擬書目的權(quán)限。3．運行虛擬書目下文件假設(shè)實際書目下有文件：1.html，則訪問該文件：⑴://localhost/tmp/1.html⑵在虛擬書目tmp屬性中的“文檔”，添加一個啟用默認文檔：1.html；則訪問該文件：://localhost/tmp同樣，對于FTP站點的配置中添加虛擬書目的寫入權(quán)限，同學(xué)們自己試試看效果。（對于一個htm文件，大家雙擊可以干脆打開，但是假如是一個asp文件則行不通，只有將asp文件放在web站點下或者虛擬書目中，然后通過……形式才能打開）四、試驗結(jié)果試驗二熟識HTML語言一、試驗?zāi)康募耙?、html文檔的習慣和規(guī)范2．Html標簽和語法二、試驗內(nèi)容1、理解HTML、鏈接和標記的概念；駕馭4種基本的標記語句<html>、<head>、<title>和<body>；2、會用<font>、<B>、<I>、<U>標記設(shè)置文字的外觀；駕馭常用的<br>、標題、<hr>、<P>、<pre>標記；駕馭<table>標記的結(jié)構(gòu)和基本屬性；駕馭超鏈接標記<A>、圖片標記<img>；三、試驗過程例2-1：字體顏色(2_1.html)<html><head><title>HTML的字體顏色</title></head><body><fontcolor="#0000FF"Face="黑體"Size=6>個人主頁!</font></body></html>例2-15：表格（2-15.html）<html><head><title>課程表</title></head><bodybgcolor="#FFFFFF"text="#000000"><center><tablealign="center"width="75%"border="0"cellspacing="0"cellpadding="0"><tralign="center"><td>課程表</td></tr></table><br><tablealign="center"width="75%"border="1"cellspacing="0"cellpadding="0"><tralign="center"><td> </td><td>星期一</td><td>星期二</td><td>星期三</td><td>星期四</td><td>星期五</td></tr><tralign="center"><td>第1節(jié)</td><td>高校語文</td><td>ASP程序設(shè)計</td><td>高校英語1</td><td>高等數(shù)學(xué)</td><td>軟件工程</td></tr><tralign="center"><td>第2節(jié)</td><td>高校語文</td><td>ASP程序設(shè)計</td><td>高校英語1</td><td>高等數(shù)學(xué)</td><td>軟件工程</td></tr><tralign="center"><td>第3節(jié)</td><td>高等數(shù)學(xué)</td><td>高校語文</td><td>軟件工程</td><td>ASP程序設(shè)計</td><td>體育</td></tr><tralign="center"><td>第4節(jié)</td><td>高等數(shù)學(xué)</td><td>高校語文</td><td>軟件工程</td><td>ASP程序設(shè)計</td><td>體育</td></tr></table><center></body></html>例2-3：超級連接(2_3.html)<html><head><title>超級連接</title></head><body><ahref="2_1.html">字體顏色</a><br/><imgsrc="1.jpg"><br/><p>這是段落P！</P><ahref="2_2.html"><imgsrc="1.jpg"></a></body></html>(1、HTML編寫的網(wǎng)頁會由于運用機器的不同而進行不一樣的顯示嗎？留意辨別率2、通過修改相關(guān)的參數(shù)你發(fā)覺運行結(jié)果有什么改變？)試驗三Dreamweaver初步與進階一、試驗?zāi)康募耙?．嫻熟駕馭Dreamwear制作靜態(tài)網(wǎng)頁的基本操作2．駕馭兩種布局的基本方法。二、試驗內(nèi)容1．在Dreamweaver中創(chuàng)建基于表格的頁面布局。頁面布局將確定您的頁面在閱讀器中會如何顯示。2．在Dreamweaver中創(chuàng)建基于層的頁面布局。要求在Dreamweaver中運用層疊樣式表(CSS)。三、試驗過程例3_1div+css布局<linkhref="css.css"rel="stylesheet"type="text/css"><body><divid="header"><h1>Header</h1></div><divid="left">Portsidetext...</div><divid="right">Starboardsidetext...</div><divid="middle">Middlecolumntext...</div><divid="footer">Footertext...</div></body>附：css.cssbody{margin:0px;padding:0px;}div#header{clear:both;height:50px;background-color:aqua;padding:1px;}div#left{float:left;width:150px;background-color:red;}div#right{float:right;width:150px;background-color:green;}div#middle{padding:0px160px5px160px;margin:0px;background-color:silver;}div#footer{clear:both;background-color:yellow;}說明：HTML代碼中各部分出現(xiàn)的依次是特別重要的。左欄和右欄div必需在中欄之前出現(xiàn)。這樣才可以讓這兩個邊欄浮動到它們的位置上（屏幕兩側(cè)），并讓中欄的內(nèi)容將“流”入它們之間的空間。假如閱讀器在一個或者兩個邊欄div之前先發(fā)覺中欄，那么中欄將占據(jù)屏幕的一側(cè)或者兩側(cè)，這樣浮動的部分就會跑到中欄的下面而不是中欄的旁邊了。

div#header和div#footer樣式（style）中的clear:both申明用來確保這浮動部分不會占據(jù)標題和頁腳的空間。div#header樣式中的padding:1px申明用來消退頁頭背景色中的異樣邊，假如padding設(shè)置為零，那么在Netscape閱讀器中就會看到這個異樣。

div#left樣式中的float:left申明是用來把左欄擠壓到左側(cè)。width:150px申明用來設(shè)置欄的固定寬度，不過你也可以把它的寬度設(shè)置為其它具體值。類似的，div#right樣式中的float:right申明用來把右欄div擠壓到右側(cè)。在本例中，float把左欄和右欄完全擠壓到閱讀器窗口的左邊緣和右邊緣。然而，假如這些div被其它div包含，那么float將會把它們擠壓到包含它們的div的邊緣。

在div#middle樣式中，clear申明允許中欄的內(nèi)容“流淌”在兩個邊欄之間。padding:0px160px5px160px申明設(shè)置了到左欄和右欄的填充，這樣允許150象素寬度的欄div，在加上10象素的間距。

這個例子特別粗糙和簡潔，但是它很好的演示了用浮動div來創(chuàng)建三欄液態(tài)布局的邊欄這一基本技術(shù)(附：運用DIV+CSS布局網(wǎng)站的優(yōu)點和缺陷隨著WEB2.0標準化設(shè)計理念的普及，國內(nèi)許多大型門戶網(wǎng)站已經(jīng)紛紛采納IV+CSS制作方法，奮斗網(wǎng)絡(luò)也成為了CSS網(wǎng)頁布局技術(shù)學(xué)習的先鋒站點，從實際應(yīng)用狀況來看，此種方法肯定好于表格制作頁面的方法。如今大部分網(wǎng)站仍舊采納表格嵌套內(nèi)容的方式來制作網(wǎng)站，雖然此方法對于我們來說比較熟識、比較上手；但是，它卻阻礙了一種更好的、更有親和力的、更敏捷的，而且功能更強大的網(wǎng)站設(shè)計方法——DIV+CSS。CSS網(wǎng)頁布局的意義體現(xiàn)在如下方面：一、使頁面載入得更快由于將大部分頁面代碼寫在了CSS當中，使得頁面體積容量變得更小。相對于表格嵌套的方式，DIV+CSS將頁面獨立成更多的區(qū)域，在打開頁面的時候，逐層加載。而不像表格嵌套那樣將整個頁面圈在一個大表格里，使得加載速度很慢。二、降低流量費用頁面體積變小，閱讀速度變快，這就使得對于某些限制主機流量的網(wǎng)站來說是最大的優(yōu)勢了。三、修改設(shè)計時更有效率由于運用了DIV+CSS制作方法，在修改頁面的時候更加簡潔省時。依據(jù)區(qū)域內(nèi)容標記，到CSS里找到相應(yīng)的ID，使得修改頁面的時候更加便利，也不會破壞頁面其他部分的布局樣式。四、保持視覺的一樣性DIV+CSS最重要的優(yōu)勢之一：保持視覺的一樣性；以往表格嵌套的制作方法，會使得頁面與頁面，或者區(qū)域與區(qū)域之間的顯示效果會有偏差。而運用DIV+CSS的制作方法，將全部頁面，或全部區(qū)域統(tǒng)一用CSS文件限制，就避開了不同區(qū)域或不同頁面體現(xiàn)出的效果偏差。五、更好地被搜尋引擎收錄由于將大部分的HTML代碼和內(nèi)容樣式寫入了CSS文件中，這就使得網(wǎng)頁中正文部分更為突出明顯，便于被搜尋引擎采集收錄。六、對閱讀者和閱讀器更具親和力我們都知道網(wǎng)站做出來是給閱讀者運用的，對閱讀者和閱讀器更具親和力，DIV+CSS在這方面更具優(yōu)勢。由于CSS富含豐富的樣式，使頁面更加敏捷性，它可以依據(jù)不同的閱讀器，而達到顯示效果的統(tǒng)一和不變形。說了這么多CSS網(wǎng)頁布局的意義與優(yōu)點，同時也不能輕視CSS網(wǎng)頁布局的副作用：一、DIV+CSS盡管不是高不行及，但至少要比表格定位困難的多，即使對于網(wǎng)站設(shè)計高手也很簡潔出現(xiàn)問題，更不要說初學(xué)者了。二、CSS網(wǎng)站制作的設(shè)計元素通常放在1個外部文件中，或幾個文件，有可能相當困難，甚至比較浩大，假如CSS文件調(diào)用出現(xiàn)異樣，那么整個網(wǎng)站將變得慘不忍睹。三、雖然說DIV+CSS解決了大部分閱讀器兼容問題，但是也有在部分閱讀器中運用出現(xiàn)異樣，比如火狐閱讀器，在IE中顯示正常的頁面，到了火狐閱讀器中可能會面目全非。當然這應(yīng)當是閱讀器的問題，但是可以說在目前來看，DIV+CSS還沒有實現(xiàn)全部閱讀器的統(tǒng)一兼容。四、DIV+CSS對搜尋引擎優(yōu)化與否,取決于網(wǎng)頁設(shè)計的專業(yè)水平,而不是DIV+CSS本身。DIV+CSS網(wǎng)頁設(shè)計并不能保證網(wǎng)頁對搜尋引擎的優(yōu)化，甚至不能保證肯定比HTML網(wǎng)站有更簡潔的代碼設(shè)計，何況搜尋引擎對于網(wǎng)頁的收錄和排序明顯不是以是否采納表格和CSS定位來衡量，這就是為什么許多傳統(tǒng)表格布局制作的網(wǎng)站在搜尋結(jié)果中的排序靠前，而許多運用CSS及web標準制作的網(wǎng)頁排名依舊靠后的緣由。因為對于搜尋引擎而言，網(wǎng)站結(jié)構(gòu)、內(nèi)容、相關(guān)網(wǎng)站鏈接等因素始終是網(wǎng)站優(yōu)化最重要的指標。綜合以上探討的DIV+CSS優(yōu)勢和略勢，我認為不行盲目跟風，如何更有效、更合理的運用WEB2.0設(shè)計標準，這須要很長時間的學(xué)習和熬煉。而如何將DIV+CSS運用的更好，我覺得這須要通過不斷的實踐和體檢，積累豐富的設(shè)計閱歷，才能很好的駕馭這門技術(shù)。)試驗四ASP網(wǎng)頁設(shè)計一、試驗?zāi)康募耙?．熟識一兩種腳本語言2．能運用ASP進行簡潔的網(wǎng)頁編程，駕馭幾種常見的ASP的內(nèi)建對象運用方法，了解幾種ASP常用外部組件的運用方法二、試驗內(nèi)容1．運用腳本語言顯示一個時鐘2．做一個用戶登陸的簡潔ASP網(wǎng)頁三、試驗過程4_1一個顯示時間的vbscript網(wǎng)頁datetime.html/datatime.asp<html><body><scripttype="text/vbscript">document.write("今日的日期是："&date())document.write("<br/>")document.write("時間是："&time())</script></body></html>4_2一個顯示時鐘的javascript網(wǎng)頁clock.html/clock.asp<html><head><scripttype="text/javascript">functionstartTime(){vartoday=newDate()varh=today.getHours()varm=today.getMinutes()vars=today.getSeconds()//addazeroinfrontofnumbers<10m=checkTime(m)s=checkTime(s)document.getElementById('txt').innerHTML=h+":"+m+":"+st=setTimeout('startTime()',500)}functioncheckTime(i){if(i<10){i="0"+i}returni}</script></head><bodyonload="startTime()"><divid="txt"></div></body></html>4_3一個帶客戶端認證（javascript）的用戶登陸網(wǎng)頁login.html<html><head><Scriptlanguage="javascript"><!--functioncheck(){if(.value==""){alert("帳號不能為空");returnfalse;}if(document.form.pass.value==""){alert("請?zhí)顚懨艽a");returnfalse;}}--></Script></head><body><formname="form"method="post"action="login.asp"onsubmit="returncheck();"><tableborder="0"align="center"> <tr><td>用戶名:</td><td><inputtype="text"name="name"></td></tr> <tr><td>密  碼:</td><td><inputtype="password"name="pass"size="26px;"style="margin-left:0"></td></tr><tr> <td><inputtype="submit"name="login"value="登陸"></td> <td><inputtype="reset"name="clean"value="重置"></td></tr></table></form></body></html>4_4一個接受客戶端信息的頁面login.asp<% response.write"姓名:"&request.form("name")&"<br/>"response.write"密碼："&request.form("pass")%>試驗五網(wǎng)站建設(shè)中的數(shù)據(jù)庫應(yīng)用一、試驗?zāi)康募耙?、ACCESS數(shù)據(jù)庫建立的方法；2、ASP中數(shù)據(jù)庫連接的方法3、在網(wǎng)頁中如何進行數(shù)據(jù)庫查詢和插入、修改等基本操作；二、試驗內(nèi)容1．建立一個數(shù)據(jù)庫，其中有一個表news(title,content,readnum,new)其中readnum是數(shù)字，其他為文本格式，自動編號字段為”編號”2．在ASP中進行各種操作三、試驗過程5_1查詢并顯示數(shù)據(jù)庫中全部的記錄，按自動編號的降序排列<%'單引號說明說明，大小寫vbscript不敏感SetConnObj=Server.CreateObject("ADODB.Connection")DbPath=Server.MapPath("./company.mdb")ConnObj.Open"DRIVER={MicrosoftAccessDriver(*.mdb)};dbq="&DbPath

sql="SELECT*FROMnewsORDERBY編號DESC"Setrsobj=Server.CreateObject("ADODB.RecordSet")rsobj.Opensql,ConnObjdountilrsobj.EOFforeachxinrsobj.FieldsResponse.Write(x.value&" ")nextResponse.Write("<br/>")rsobj.MoveNextlooprsobj.closeconnobj.close%>5_2刪除編號為1的記錄dell.asp<%SetConnObj=Server.CreateObject("ADODB.Connection")DbPath=Server.MapPath("./company.mdb")ConnObj.Open"DRIVER={MicrosoftAccessDriver(*.mdb)};dbq="&DbPathSQL="delete*FromnewsWhere編號=1"ConnObj.Execute(SQL)setconnobj=nothing'response.redirect"index.asp"%>5_3依據(jù)肯定格式顯示某條記錄的全部內(nèi)容，并修改其中的一個字段readnumReadnum為數(shù)字數(shù)據(jù)newsview.asp<divid="Layer4"style="word-wrap:break-word;word-break:break-all;"><!—英文自動換行--><%SetConnObj=Server.CreateObject("ADODB.Connection")DbPath=Server.MapPath("./company.mdb")ConnObj.Open"DRIVER={MicrosoftAccessDriver(*.mdb)};dbq="&DbPathsql="SE

溫馨提示

  • 1. 本站所有資源如無特殊說明，都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等，如果需要附件，請聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙，網(wǎng)頁內(nèi)容里面會有圖紙預(yù)覽，若沒有圖紙預(yù)覽就沒有圖紙。
  • 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
  • 5. 人人文庫網(wǎng)僅提供信息存儲空間，僅對用戶上傳內(nèi)容的表現(xiàn)方式做保護處理，對用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯，并不能對任何下載內(nèi)容負責。
  • 6. 下載文件中如有侵權(quán)或不適當內(nèi)容，請與我們聯(lián)系，我們立即糾正。
  • 7. 本站不保證下載資源的準確性、安全性和完整性, 同時也不承擔用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。

評論

0/150

提交評論