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

下載本文檔

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

文檔簡介

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

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

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

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

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

sql="SELECT*FROMnewsORDERBY編號(hào)DESC"Setrsobj=Server.CreateObject("ADODB.RecordSet")rsobj.Opensql,ConnObjdountilrsobj.EOFforeachxinrsobj.FieldsResponse.Write(x.value&" ")nextResponse.Write("<br/>")rsobj.MoveNextlooprsobj.closeconnobj.close%>5_2刪除編號(hào)為1的記錄dell.asp<%SetConnObj=Server.CreateObject("ADODB.Connection")DbPath=Server.MapPath("./company.mdb")ConnObj.Open"DRIVER={MicrosoftAccessDriver(*.mdb)};dbq="&DbPathSQL="delete*FromnewsWhere編號(hào)=1"ConnObj.Execute(SQL)setconnobj=nothing'response.redirect"index.asp"%>5_3依據(jù)肯定格式顯示某條記錄的全部內(nèi)容，并修改其中的一個(gè)字段readnumReadnum為數(shù)字?jǐn)?shù)據(jù)newsview.asp<divid="Layer4"style="word-wrap:break-word;word-break:break-all;"><!—英文自動(dòng)換行--><%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)容里面會(huì)有圖紙預(yù)覽，若沒有圖紙預(yù)覽就沒有圖紙。
  • 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
  • 5. 人人文庫網(wǎng)僅提供信息存儲(chǔ)空間，僅對用戶上傳內(nèi)容的表現(xiàn)方式做保護(hù)處理，對用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯，并不能對任何下載內(nèi)容負(fù)責(zé)。
  • 6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容，請與我們聯(lián)系，我們立即糾正。
  • 7. 本站不保證下載資源的準(zhǔn)確性、安全性和完整性, 同時(shí)也不承擔(dān)用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。

最新文檔

評論

0/150

提交評論