【正文】 面的添 加事件做準(zhǔn)備 =id(infoId)。 var targetIdx=0。 })(i)。 } } function fadeOut(elem) { for ( var i = 0。 i 20。} else { for (var i = 0, len = 。然后設(shè) 計(jì)網(wǎng)頁的表現(xiàn)框架，建立頁面模型。 網(wǎng)站裝飾風(fēng)格 采用了灰白色為主導(dǎo) 航顏色，首頁中運(yùn)用最新更新圖片，以及文字交錯(cuò)排版，使整個(gè)網(wǎng)站看上去符合跳動(dòng)的風(fēng)格。 網(wǎng)站中部：網(wǎng)站信息；站點(diǎn)數(shù)據(jù)；網(wǎng)站導(dǎo)航條；圖文信息。 完善的網(wǎng)站內(nèi)容，網(wǎng)站 內(nèi)容下載系統(tǒng)。導(dǎo)航條又包含 首頁、為什么 選擇準(zhǔn)達(dá) 、精品 課程 、品質(zhì) 教學(xué) 、人才 服務(wù) 、企業(yè) 服務(wù) 、合作 伙伴 、 企業(yè)指南 。 網(wǎng)站前臺(tái)頁面設(shè)計(jì) XXXXXXXX 培訓(xùn)中心 網(wǎng)站主要包括：首頁、為什么 選擇準(zhǔn)達(dá) 、精品 課程 、品質(zhì) 教學(xué) 、人才 服務(wù) 、企業(yè) 服務(wù) 、合作 伙伴 、 企業(yè)指南 等 ８ 個(gè)子頁面，制作過程如下。 D區(qū)域是廣告 區(qū)， 發(fā)表各種有 關(guān) XXXXXXXX 招生 類的信息 。導(dǎo)航欄跟頂端 logo 的顏色基本上一直用戶瀏覽網(wǎng)頁時(shí)不會(huì)產(chǎn)生視覺疲勞。 站點(diǎn)設(shè)計(jì)簡(jiǎn)單有序，主次關(guān)系分明，將零亂頁面的組織過程， 混雜的內(nèi)容，依整體的布局的需要進(jìn)行分組歸納，經(jīng)過進(jìn)行具有內(nèi)在聯(lián)系的組織排列， 反復(fù)推敲文字， 圖形與空間的關(guān)系，使瀏覽者有一個(gè)流暢的視覺體驗(yàn)。對(duì)網(wǎng)站的整體風(fēng)格和特色做出定位，規(guī)劃網(wǎng)站的組織結(jié)構(gòu) 。整體網(wǎng)站遵循 華為 培訓(xùn)中心 類網(wǎng)站的設(shè)計(jì)思路 ，擁有完善的功能，風(fēng)格要求簡(jiǎn)潔大方不單調(diào)。 XXXXXXXX 培訓(xùn)中心 網(wǎng)站主要用來進(jìn)行教學(xué)信息的發(fā)布與顯示。 代碼更可控，開發(fā)效率更高。 內(nèi)部測(cè)試與后續(xù)優(yōu)化 前端的內(nèi)部測(cè)試，指出頁面與設(shè)計(jì)稿不匹配的地方，優(yōu)化部分細(xì)節(jié)頁面樣式。 11 前端 設(shè)計(jì) 樣式確定以 后，就進(jìn)行通用模塊樣式的設(shè)計(jì)（包括按鈕，分 頁，默認(rèn)字體顏色，連接顏色等），完成后并提交給前端，統(tǒng)一的搭建。 代碼編寫 前期工作準(zhǔn)備好后，就開始進(jìn)入代碼編寫階 段 ，我們采用 LSM 方式進(jìn)行，大致流程為 總規(guī)劃和設(shè)計(jì)草稿完成 后，就進(jìn)行前期的前端開發(fā)（搭建大致的HTML 結(jié)構(gòu)），然后設(shè)計(jì)出完設(shè)計(jì)稿后再進(jìn)行頁面樣式的完善 ，最后完成正式的頁面后交給開發(fā)，嵌套程序。 分層開發(fā) 在 XXXXXXXX 培訓(xùn)中心 網(wǎng)站概要確定后就需要進(jìn)行分層開發(fā)的劃分， 根據(jù)項(xiàng)目?jī)?nèi)容的 不同，劃分工作。當(dāng)事件發(fā)生后，可能會(huì)引起相應(yīng)的事件響應(yīng)。 (4) 動(dòng)態(tài)性 javascript 是動(dòng)態(tài)的，它可以直接對(duì)用戶或客戶輸入做出響應(yīng)，無須經(jīng)過Web 服務(wù)程序。 (2) 簡(jiǎn)單性 javascript 的簡(jiǎn)單性主要體現(xiàn)在：首先它是一種基于 Java 基本語句和控制流之上的簡(jiǎn)單而緊湊的設(shè)計(jì)， 從而對(duì)于學(xué)習(xí) Java 是一種非常好的過渡。使得網(wǎng)頁有更好的擴(kuò)展性，適用數(shù)據(jù)自動(dòng)交換，而且更加規(guī)整。 CSS 有如此多的好處，使用好和掌握 CSS技術(shù)對(duì)于網(wǎng)頁設(shè)計(jì)師來說是非常重要的。另外一種情況是如果你想讓多個(gè)個(gè) div 具有相同的樣式屬性時(shí)，可以給每個(gè) div 加上相同的 class 屬性，這種具同樣 class 屬性的 div 標(biāo)記樣式相同。此外， Google Chrome 基于更強(qiáng)大的 JavaScript V8 引擎，這是當(dāng)前 Web 瀏覽器所無法實(shí)現(xiàn)的。 （ 3） 谷歌 瀏覽器 簡(jiǎn)介 Google Chrome，又稱 谷歌 瀏覽器，是一個(gè)由 Google（谷歌）公司開發(fā)的開放原始碼網(wǎng)頁瀏覽器。 （ 2） Photoshop 簡(jiǎn)介 Adobe Photoshop，簡(jiǎn)稱“ PS”，是一個(gè)由 Adobe Systems 開發(fā)和發(fā)行的圖像處理軟件。 前端開發(fā)工具 （ 1） Dreamweare 簡(jiǎn)介 7 Dreamweare 是美國 MA CROMEDIA 公司開發(fā)的集網(wǎng)頁制作和管理網(wǎng)站于一身的所見即所得 網(wǎng)頁編輯器，它是第一套針對(duì)專業(yè)網(wǎng)頁設(shè)計(jì)師特別發(fā)展的視覺化網(wǎng)頁開發(fā)工具，利用它可以輕而易舉地制作出跨越平臺(tái)限制和跨越瀏覽器限制的充滿動(dòng)感的網(wǎng)頁。用 Dreamweare、 DIV+CSS、 Javascript 等布局網(wǎng)頁內(nèi)容，制作靜 態(tài)頁面，這些頁面要兼容各主流瀏覽器，并配合程序完成靜態(tài)頁面 的整合工作。 信息設(shè)計(jì)，信息設(shè)計(jì)就是通過網(wǎng)站傳達(dá)給用戶某些信息，用戶可通過這些信息了解自己正在進(jìn)行的某些事和應(yīng)該如何進(jìn)行某些事。 (4) 交互性 做一個(gè)完整的網(wǎng)站 有幾樣任務(wù)要完成比如復(fù)雜的交互功能，網(wǎng)頁動(dòng)畫特效，網(wǎng)頁 UI 設(shè)計(jì)，后期維護(hù)，可擴(kuò)展性等。 這些圖像是網(wǎng)站增加吸引力的網(wǎng)。 這些好的設(shè)計(jì)不只是使用的標(biāo)準(zhǔn)字體，而加上其使用自定義的字體。由于網(wǎng)站是由他們的業(yè)務(wù)與其他很多人用來獲取信息的途徑， 所以很重要的設(shè)計(jì)是很有吸引力的。 5 (3) XXXXXXXX 培訓(xùn)中心 網(wǎng)站為 廣大學(xué)子 提供了該 機(jī)構(gòu)能提供的所有 IT 技術(shù)培訓(xùn) 、 行業(yè)新聞、自身的教學(xué)優(yōu)勢(shì)等信息。 建立本系網(wǎng)站發(fā)揮的作用如下 ： (1) XXXXXXXX 中心 網(wǎng)站是 IT 技術(shù) 培訓(xùn) 的“商標(biāo)”。這個(gè)是前端開發(fā)中最基本也是 必須的四 個(gè)技能。教育機(jī)構(gòu) 網(wǎng)站的建立和維護(hù) 需要大量的物力和人力，為何要投入去建網(wǎng)站 ？是因?yàn)槿缟纤龅慕逃?機(jī)構(gòu) 網(wǎng)站有 獨(dú)特特性使得建設(shè)教育 機(jī)構(gòu) 網(wǎng)站勢(shì)在必行。 該網(wǎng)站有效地實(shí)現(xiàn)用戶通過 html 頁面來訪問 網(wǎng) 站的有效 信息 ，提升了后期添加和刪除信息的有效性，具有一定的應(yīng)用價(jià)值 關(guān)鍵字 ： div+css； javascript；網(wǎng)站美化。 學(xué)號(hào) 填寫學(xué)校名稱 畢 業(yè) 論 文 論文題目 學(xué)生姓名 專業(yè)名稱 指導(dǎo)教師 20xx 年 12 月 1 目錄 第 1章 緒論 ........................................................................................................................... 4 選題背景及意義 ............................................................................................................. 4 研究?jī)?nèi)容和擬解決的問題 ............................................................................................... 5 本章小結(jié) ........................................................................................................................ 6 第 2章 前端開發(fā)工具及相關(guān)技術(shù) ........................................................................................... 6 前端開發(fā)環(huán)境 ................................................................................................................. 6 前端開發(fā)工具 ................................................................................................................. 6 前端開發(fā)相關(guān)技術(shù) .......................................................................................................... 7 DIV+CSS 簡(jiǎn)介 ...........................