PHP網(wǎng)站開發(fā)PHP設(shè)計(jì)emailphp頁(yè)面_第1頁(yè)
PHP網(wǎng)站開發(fā)PHP設(shè)計(jì)emailphp頁(yè)面_第2頁(yè)
PHP網(wǎng)站開發(fā)PHP設(shè)計(jì)emailphp頁(yè)面_第3頁(yè)
PHP網(wǎng)站開發(fā)PHP設(shè)計(jì)emailphp頁(yè)面_第4頁(yè)
PHP網(wǎng)站開發(fā)PHP設(shè)計(jì)emailphp頁(yè)面_第5頁(yè)
已閱讀5頁(yè)，還剩19頁(yè)未讀， 繼續(xù)免費(fèi)閱讀

下載本文檔

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

文檔簡(jiǎn)介

任務(wù)七163郵箱寫郵件功能實(shí)現(xiàn)說(shuō)明文件email.php地內(nèi)容,對(duì)右圖所示地界面進(jìn)行分析（不包括圖右下部分地內(nèi)容）當(dāng)用戶登錄成功之后進(jìn)入該頁(yè)面7.1設(shè)計(jì)郵箱主窗口界面email.php頁(yè)面地功能特點(diǎn)說(shuō)明email.php頁(yè)面右下部分是浮動(dòng)框架子窗口,在該窗口內(nèi)部可以運(yùn)行寫郵件頁(yè)面文件,收郵件頁(yè)面文件,閱讀郵件頁(yè)面文件等該頁(yè)面窗口寬度始終與瀏覽器窗口寬度一致,為了保證頁(yè)面地美觀,將頁(yè)面邊距設(shè)置為0整個(gè)頁(yè)面功能地實(shí)現(xiàn)包含了樣式代碼,頁(yè)面文件代碼與腳本代碼三個(gè)部分代碼地創(chuàng)建,分別使用email.css,email.php與email.js三個(gè)文件來(lái)完成頁(yè)面布局需要地div說(shuō)明wshdiv地樣式要求為:寬度自動(dòng),高度50px,上右下左填充分別是10px,10px,0,10px,邊距0,下邊框6px,實(shí)線,顏色為#88f;思考:此處能否將寬度auto改為100%？為何？wshdiv地寬度問(wèn)題不可將width:auto;改為width:100%原因說(shuō)明:寬度取值為auto,使得內(nèi)容區(qū)地寬度能夠根據(jù)元素地邊框,邊距,填充等樣式值自動(dòng)調(diào)整,保證整個(gè)元素地總寬度與窗口同寬若是改為100%,則無(wú)論邊框邊距填充取值如何,都是內(nèi)容區(qū)與窗口同寬7.1.1設(shè)計(jì)頂部區(qū)域

wshleft元素及樣式說(shuō)明wshleft盒子地樣式要求為:邊距為0,向左浮動(dòng),內(nèi)部文本字號(hào)10pt;在盒子wshleft包含了圖片163logo.gif（與右側(cè)文本框與超鏈接文本線對(duì)齊）,用于顯示賬號(hào)信息地文本框與"網(wǎng)易","幫助","退出"三個(gè)超鏈接,點(diǎn)擊"退出"時(shí)要返回登錄界面,其它兩個(gè)超鏈接地href屬性設(shè)置為#即可。文本框地樣式要求:使用class類選擇符emailaddr定義,寬度150px,無(wú)邊框,內(nèi)部字體加粗,只讀狀態(tài);超鏈接地樣式要求:初始狀態(tài),訪問(wèn)過(guò)狀態(tài)與鼠標(biāo)懸停狀態(tài)時(shí)都設(shè)置顏色#555,無(wú)下劃線效果。為emailaddr文本框設(shè)置內(nèi)容頁(yè)面emailaddr文本框在頁(yè)面初始運(yùn)行時(shí)就填入了用戶登錄時(shí)地賬號(hào)@163.,例如登錄賬號(hào)是liuling,則此處顯示liuling@163.思考問(wèn)題:完成上面功能,需要設(shè)置文本框地什么屬性？該屬性地值來(lái)自何處？需要設(shè)置該文本框地value屬性值來(lái)實(shí)現(xiàn)上面功能,屬性值來(lái)自于服務(wù)器文件denglu.php使用變量$emailaddr所保存地登錄賬號(hào)信息為emailaddr文本框設(shè)置內(nèi)容代碼為value="<?phpecho$emailaddr.'@163.';?>"denglu.php保存地?cái)?shù)據(jù)服務(wù)器端文本框?yàn)g覽器端為emailaddr文本框設(shè)置內(nèi)容思考問(wèn)題在email.php文件為什么能夠直接使用denglu.php頁(yè)面變量$emailaddr地值,而不需要使用session來(lái)傳遞？因?yàn)閑mail.php文件是在denglu.php文件使用include包含地方式來(lái)運(yùn)行地,隸屬于denglu.php文件,因而denglu.php文件地變量可以直接在email.php文件使用為emailaddr文本框設(shè)置內(nèi)容思考問(wèn)題因?yàn)閑mail.php文本框內(nèi)容來(lái)自文件denglu.php地變量$emailaddr,如果要使用在denglu.php文件輸出腳本代碼地方式,設(shè)置email.php文件emailaddr文本框內(nèi)容,實(shí)現(xiàn)代碼如何？7.1.1設(shè)計(jì)頂部區(qū)域

wshright元素及樣式說(shuō)明盒子wshright地樣式要求為:向右浮動(dòng),邊距為0;盒子內(nèi)部包含地元素有:一個(gè)用于輸入搜索內(nèi)容地文本框與一個(gè)搜索圖片按鈕,圖片要使用align="top"屬性設(shè)置文本框與其頂端對(duì)齊文本框地樣式要求:使用class類選擇符search定義寬200px,高26px,邊框?yàn)榛疑?ddd,1px,實(shí)線,使用placeholder設(shè)置提示文本"支持全文搜索"7.1.2設(shè)計(jì)左下部區(qū)域bot元素地添加樣式說(shuō)明:寬度自動(dòng),高度自動(dòng),填充0,邊距0說(shuō)明:該div地作用只是作為#leftdiv與.maindiv地父元素,保證浮動(dòng)元素不會(huì)出現(xiàn)混亂leftdiv樣式說(shuō)明樣式要求為:寬200px,高600px,邊距0,填充0,右邊框與下邊框?qū)挾?px,實(shí)線,顏色為#aaf,背景色為#eef,向左浮動(dòng)。思考問(wèn)題:盒子地總寬度是多少？Leftdivtop超鏈接地添加在盒子leftdivtop包含了圖片writerecieve.jpg,在該圖片上做了兩個(gè)圖像映射超鏈接（使用圖像映射工具完成）寫信超鏈接href設(shè)置為writeemail.php,target設(shè)置為main（這是浮動(dòng)框架地name）;收信超鏈接href設(shè)置為receiveemail.php,target也設(shè)置為main。leftdivbot超鏈接地添加盒子內(nèi)部包含地元素是四個(gè)超鏈接,四個(gè)超鏈接使用段落來(lái)分開:段前段后10px,字號(hào)10pt,超鏈接要求如下:鏈接初始狀態(tài)與訪問(wèn)過(guò)狀態(tài)都是灰色#999,沒(méi)有下劃線;鼠標(biāo)懸停時(shí)為藍(lán)色#ddf,顯示下劃線收件箱receiveemail.php,在main顯示草稿箱（空鏈接）已發(fā)送（空鏈接）已刪除deletedemail.php,在main顯示7.1.3設(shè)計(jì)右下部區(qū)域

maindiv地樣式及元素說(shuō)明maindiv地樣式要求為:寬度與高度都是auto,邊距為0,填充為0,向左浮動(dòng)與leftdiv排列在同一水平位置上在maindiv內(nèi)部地是一個(gè)浮動(dòng)框架,浮動(dòng)框架要求如下:為浮動(dòng)框架定義地name與id都是main浮動(dòng)框架初始時(shí)加載地頁(yè)面文件是writeemail.php浮動(dòng)框架地寬度與高度都設(shè)置為自動(dòng)（稍后將通過(guò)腳本來(lái)設(shè)置其寬度與高度值）滾動(dòng)條設(shè)置為無(wú)浮動(dòng)框架寬度說(shuō)明整個(gè)郵箱主窗口界面地寬度始終與瀏覽器窗口寬度保持一致在盒子bot內(nèi)部左側(cè)地leftdiv地寬度是固定地（201px）右側(cè)地maindiv寬度為自動(dòng)（實(shí)際寬度將根據(jù)內(nèi)部浮動(dòng)框架寬度確定）因此要求maindiv內(nèi)部地浮動(dòng)框架地寬度需要能夠適應(yīng)瀏覽器窗口地變化,若窗口變寬,浮動(dòng)框架寬度要變寬,若窗口變窄,浮動(dòng)框架寬度要變窄,從而做到由浮動(dòng)框架窗口地寬度來(lái)決定盒子maindiv地寬度。思考問(wèn)題浮動(dòng)框架子窗口地寬度要根據(jù)什么進(jìn)行計(jì)算？回答問(wèn)題:浮動(dòng)框架main地寬度需要使用瀏覽器窗口寬度減去201得到思考問(wèn)題:如何獲取瀏覽器窗口地寬度？獲取瀏覽器窗口寬度獲取瀏覽器窗口地寬度需要分別針對(duì)兩種情況來(lái)進(jìn)行第一種情況,頁(yè)面沒(méi)有使用xhtml地有關(guān)標(biāo)準(zhǔn),即在頁(yè)面代碼開始時(shí)直接使用<html>標(biāo)記時(shí),需要使用代碼document.body.clientWidth獲取到瀏覽器窗口可見區(qū)域地寬度第二種情況,頁(yè)面使用了xhtml地有關(guān)標(biāo)準(zhǔn)（現(xiàn)在頁(yè)面普遍使用）,需要使用代碼document.documentElement.clientWidth;獲取到瀏覽器窗口可見區(qū)域地寬度定義函數(shù)實(shí)現(xiàn)浮動(dòng)框架地寬度自適應(yīng)創(chuàng)建email.js文件,定義函數(shù)iframeWidth(),實(shí)現(xiàn)如下功能使用代碼winWidth=document.body.clientWidth||document.documentElement.clientWidth獲取瀏覽器窗口地寬度,使用或運(yùn)算符可以保證能夠獲取任何情況頁(yè)面所在瀏覽器窗口地寬度使用document.getElementById("main").width=winWidth-201設(shè)置浮動(dòng)框架窗口寬度調(diào)用函數(shù)iframeWidth()首先在email.php文件引用腳本文件email.js函數(shù)iframeWidth()地調(diào)用需要在兩種情況下進(jìn)行第一種情況是,加載頁(yè)面文件email.php時(shí),此時(shí)激活地是window對(duì)象地onload,在函數(shù)定義完成地花括號(hào)后面使用代碼window.onload=iframeWidth;進(jìn)行調(diào)用;第二種情況是,當(dāng)用戶調(diào)整瀏覽器窗口大小時(shí),此時(shí)激活地是window對(duì)象地onresize,在函數(shù)定義完成地花括號(hào)后面使用代碼window.onresize=iframeWidth;進(jìn)行調(diào)用。浮動(dòng)框架高度設(shè)置為固定值存在地缺陷浮動(dòng)框架子窗口地內(nèi)容總是根據(jù)點(diǎn)擊地超鏈接來(lái)加載,如果將其高度設(shè)置為固定值,存在如下缺陷:第一,若浮動(dòng)框架初始高度小于加載進(jìn)來(lái)地頁(yè)面高度,在內(nèi)部需要出現(xiàn)滾動(dòng)條,存在了內(nèi)外雙滾動(dòng)情況,會(huì)影響頁(yè)面地美觀性;第二,若浮動(dòng)框架初始高度高于加載進(jìn)來(lái)地頁(yè)面高度,浮動(dòng)框架底部頁(yè)面內(nèi)容下方將出現(xiàn)大片地空白區(qū)域,也會(huì)影響頁(yè)面地美觀性。因此我們?cè)陧?xiàng)目定義浮動(dòng)框架時(shí),其高度直接設(shè)置為auto思考問(wèn)題浮動(dòng)框架子窗口地高度要根據(jù)什么進(jìn)行設(shè)置？浮動(dòng)框架子窗口地高度要根據(jù)加載到子窗口內(nèi)部地頁(yè)面內(nèi)容地高度來(lái)設(shè)置獲取浮動(dòng)框架子窗口頁(yè)面內(nèi)容地高度獲取頁(yè)面內(nèi)容高度時(shí),需要考慮運(yùn)行頁(yè)面文件時(shí)使用地瀏覽器,在不同瀏覽器下面運(yùn)行地頁(yè)面,有不同地方法來(lái)獲取加載到浮動(dòng)框架地頁(yè)面內(nèi)容地高度,主要分為IE內(nèi)核與webkit內(nèi)核兩種情況（下面地iframe1變量代表浮動(dòng)框架）第一,若瀏覽器內(nèi)核為IE,則條件if(iframe1.contentWindow)成立,此時(shí)可以使用代碼iframe1.contentWindow.document.body.offsetHeight（或者scrollHeight）獲取頁(yè)面地高度第二,若瀏覽器內(nèi)核為webkit,則條件(iframe1.contentDocument)成立,此時(shí)可以使用代碼iframe1.contentDocument.documentElement.offsetHeight獲取頁(yè)面地高度定義函數(shù)iframeHeight()設(shè)置浮動(dòng)框架子窗口地高度在email.js文件定義函數(shù)iframeHeight(),實(shí)現(xiàn)如下功能:獲取浮動(dòng)框架元素,保存在變量iframe1根據(jù)瀏覽器地內(nèi)核,獲取頁(yè)面內(nèi)容地高度,保存在變量h1使用iframe1.height=h1將h1設(shè)置為浮動(dòng)框架地高度判斷h1若是超過(guò)600,設(shè)置浮動(dòng)框架高

溫馨提示

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

最新文檔

評(píng)論

0/150

提交評(píng)論