網(wǎng)頁設(shè)計課程標準

v1.0可編寫可改正云南城市建設(shè)職業(yè)學(xué)院網(wǎng)頁設(shè)計課程標準系（部）：機電與信息工程系課程名稱：網(wǎng)頁設(shè)計編制教師：張捷編制時間：2015年5月11v1.0可編寫可改正序言《網(wǎng)頁設(shè)計》是職業(yè)院校計算機領(lǐng)域的一門骨干專業(yè)課程，也是計算機及有關(guān)專業(yè)人才培育計劃中的一門專業(yè)課程，在大二第二學(xué)期開設(shè)，課程總學(xué)時為108學(xué)時，主假如為了讓學(xué)生掌握網(wǎng)站建設(shè)必備的基礎(chǔ)知識、基本技術(shù)和基本修養(yǎng)，其主要任務(wù)是經(jīng)過網(wǎng)頁設(shè)計基礎(chǔ)學(xué)習(xí)和實訓(xùn)雙方面內(nèi)容培育學(xué)生制作網(wǎng)頁、成立保護網(wǎng)站的能力，使學(xué)生認識網(wǎng)頁制作的方法，掌握網(wǎng)頁三劍客與其余多媒體軟件相聯(lián)合開發(fā)網(wǎng)站的技術(shù)。同時達到培育高素質(zhì)勞動者和網(wǎng)站建設(shè)特意人材的目的，為此后學(xué)生就業(yè)和連續(xù)學(xué)習(xí)打下優(yōu)秀的基礎(chǔ)。此刻正處于網(wǎng)絡(luò)化和信息化時代，好多工作都離不開互聯(lián)網(wǎng)。網(wǎng)站是政府、企事業(yè)單位、公司公司信息化的核心，更是其應(yīng)用宣傳信息的要點媒體。所以特依照人材培育方案要求制定以下網(wǎng)頁設(shè)計課程標準。一、課程基本信息．課程名稱：網(wǎng)頁設(shè)計2．課程類型：專業(yè)課基礎(chǔ)課3．課程編碼：4．學(xué)時：1085．合用專業(yè)：計算機、網(wǎng)絡(luò)、挪動通訊等有關(guān)專業(yè)。1.1課程的性質(zhì)與作用1.課程的性質(zhì)網(wǎng)頁設(shè)計課程是高職計算機、網(wǎng)絡(luò)、挪動通訊等有關(guān)專業(yè)要點建設(shè)的核心課程之一，是學(xué)生職業(yè)教育的核心課程。經(jīng)過本課程的學(xué)習(xí)，使學(xué)生認識網(wǎng)頁設(shè)計、網(wǎng)站項目創(chuàng)立實行的流程及方法，具備網(wǎng)頁設(shè)計、網(wǎng)站建設(shè)與保護的基本能力，為此后學(xué)生到相應(yīng)的職業(yè)崗位工作打下基礎(chǔ)。計算機、網(wǎng)絡(luò)、電子商務(wù)等有關(guān)專業(yè)是為適應(yīng)市場經(jīng)濟發(fā)展需要，培育能在政府、公司、企事業(yè)單位從事算機系統(tǒng)保護、網(wǎng)絡(luò)保護、網(wǎng)頁設(shè)計、網(wǎng)站建設(shè)管理保護、中小型信息系統(tǒng)22v1.0可編寫可改正開發(fā)等工作的高技術(shù)人材、讓學(xué)生擁有優(yōu)秀的職業(yè)道德、嫻熟的專業(yè)技術(shù)和可連續(xù)發(fā)展的計算機應(yīng)用技術(shù)領(lǐng)域的高級應(yīng)用型人材。本課程是一門既包含理論知識又包含實踐性、技術(shù)都相對較強的課程。2．課程作用本課程有關(guān)的典型工作崗位是：前端（網(wǎng)站策劃師、網(wǎng)頁美工）、后臺（網(wǎng)站開發(fā)工程師），對其進行典型工作任務(wù)與職業(yè)能力剖析后，概括提煉出崗位核心能力為“網(wǎng)站建設(shè)”，再依照各個典型工作任務(wù)的先后次序設(shè)置支撐的項目課程群?！毒W(wǎng)站建設(shè)》的先行課程為《圖像辦理photoshop》，《HTML，CSS，DIV》和《Dreamweaver網(wǎng)頁設(shè)計》《flash》《T1基礎(chǔ)能力美術(shù)，圖案,色彩基礎(chǔ)》《網(wǎng)站建設(shè)實訓(xùn)》等，詳盡的可見下表，它們是支撐“網(wǎng)站建設(shè)”核心能力的基礎(chǔ)課程?；A(chǔ)能力擴展能力高級能力PHP（或ASP，JSP）等動向HTML，CSS，DIVHTML+div+css網(wǎng)站開發(fā)工具基礎(chǔ)能力Dreamweaver迅速建站模板工具Ajax等最新技術(shù)T1:網(wǎng)頁設(shè)FireWorkFireWork網(wǎng)頁成效圖制作計師PhotoShop基礎(chǔ)必定的語言表達、交流能力圖形圖像辦理網(wǎng)站商業(yè)廣告宣傳動畫制廣告宣傳動畫flashFlash作能力圖片制作T1基礎(chǔ)能力T2:網(wǎng)頁美工美術(shù)，圖案,色彩基礎(chǔ)嫻熟掌握PhotoShop網(wǎng)站標記設(shè)計制Logomaker軟件應(yīng)用標記設(shè)計作T1基礎(chǔ)能力IIS(服務(wù)器配置)數(shù)據(jù)庫設(shè)計能力T3:網(wǎng)站建設(shè)數(shù)據(jù)庫（SQL或ACCESS）使動向網(wǎng)站開發(fā)工具項目網(wǎng)站建設(shè)，美化用能力高級能力33v1.0可編寫可改正T3所有能力數(shù)據(jù)庫設(shè)計能力軟件工程剖析能力T5：網(wǎng)站剖析理解領(lǐng)域業(yè)務(wù)的能策劃、剖析能力網(wǎng)站需求剖析能力和設(shè)計力語言表達、交流能力經(jīng)過網(wǎng)站項目開發(fā)的教課，使學(xué)生掌握網(wǎng)站開發(fā)的過程及網(wǎng)頁的設(shè)計制作方法和步驟，該課程主要內(nèi)容有網(wǎng)站規(guī)劃與網(wǎng)頁設(shè)計、靜態(tài)網(wǎng)頁制作、CSS規(guī)則的應(yīng)用、網(wǎng)站測試公布與保護的知識和技術(shù)，為后續(xù)課程的學(xué)習(xí)供給網(wǎng)頁設(shè)計與制作的理論基礎(chǔ)和技術(shù)支持。本課程不論對培育學(xué)生的創(chuàng)新思想、協(xié)作精神、正確的設(shè)計理念和方法、信息辦理能力、解決問題能力、自我學(xué)習(xí)能力、高級能力，仍是對培育網(wǎng)頁、網(wǎng)站制作的實踐操作技術(shù)、知足職業(yè)崗位需求以及對后繼課程的學(xué)習(xí)，都擁有十分重要的作用。1.2課程的基本理念1．突出學(xué)生職業(yè)能力的培育本課程以建設(shè)公司網(wǎng)站項目為載體，以網(wǎng)站項目的建設(shè)與保護工程流程為主線，經(jīng)過項目全面學(xué)習(xí)網(wǎng)站建設(shè)與保護的有關(guān)知識和技術(shù)，及步驟方法，使學(xué)生對真切的建設(shè)網(wǎng)站項目的流程有一個較全面的認識，形成職業(yè)崗位所需的基本能力，為此后從事有關(guān)職業(yè)崗位作前期準備。2．以學(xué)生主體，從實踐中鍛煉學(xué)生能力本課程在實行過程中，按工作流程將項目分解為詳細的工作任務(wù)，教課中實行任務(wù)驅(qū)動，同時，指引學(xué)生組建項目團隊，以學(xué)生為主體，團隊在教師的啟迪、提示下自主地展開學(xué)習(xí)，學(xué)生依據(jù)任務(wù)，經(jīng)過團隊議論，主動查閱資料，養(yǎng)成獨立策劃、剖析問題和解決問題的能力。3．尊敬個體差別，著重過程評論本課程在教課實行過程中，倡議學(xué)生自主學(xué)習(xí)，鼓舞多元思想方式，并將其表達出來，尊敬個體差別，發(fā)揮不一樣種類學(xué)生的優(yōu)點，成立由形成性評論和總結(jié)性評論相聯(lián)合的評論體44v1.0可編寫可改正系，教課過程中以形成性評論為主，著重學(xué)生學(xué)習(xí)的踴躍和自信心，總結(jié)性評論著重評論學(xué)生做成事的能力。1.3課程標準的設(shè)計思路在課程標準的設(shè)計過程中以網(wǎng)頁設(shè)計基礎(chǔ)為一定掌握知識，以實訓(xùn)公司網(wǎng)頁設(shè)計項目的完好創(chuàng)立過程對各環(huán)節(jié)知識、技術(shù)進行知識穩(wěn)固和運用，環(huán)繞預(yù)設(shè)能力目標，對學(xué)習(xí)目標、學(xué)習(xí)任務(wù)、能力要求、教課內(nèi)容、活動設(shè)計和教課建議等都均參照人材培育方案。教課方法在教課網(wǎng)頁設(shè)計基礎(chǔ)中主要采納事例、解說、實做的方式來進行，經(jīng)過理論、事例的講解和演示，讓學(xué)生能夠清楚到實踐的操作，掌握本課程的有關(guān)知識。圖表表示以下教課方法理實聯(lián)合法教課議論教課法方法

解說法對照法事例教課法任務(wù)驅(qū)動法事例教課法：教課過程中。老師舉例子解說一個網(wǎng)站創(chuàng)立的過程和方法，其余有關(guān)類網(wǎng)站的創(chuàng)立就能夠用第一個網(wǎng)站建設(shè)中的一些方法去達成。議論式教課：著重講堂教課整體設(shè)計，經(jīng)過引入問題，如建設(shè)網(wǎng)站的市場剖析，能夠55v1.0可編寫可改正組織學(xué)生經(jīng)過議論找尋答案，讓學(xué)生參加交流、分享自己的見解，并進行總結(jié)和概括。經(jīng)過議論，學(xué)生真切做到了踴躍參加講堂學(xué)習(xí)。剖析問題、解決問題的能力，又增強了理論知識在實質(zhì)的應(yīng)用。還有其余的一些方法如解說法、任務(wù)驅(qū)動法等，再此就不多說。二、課程目標課程的整體目標經(jīng)過本課程的學(xué)習(xí)，使學(xué)生掌握網(wǎng)頁設(shè)計的整個工作流程和方法，能夠使用網(wǎng)頁三劍客及其余有關(guān)軟件達成網(wǎng)站前端有關(guān)工作（如網(wǎng)頁成效圖制作、網(wǎng)頁布局、用代碼生成網(wǎng)頁等），在教課過程中，經(jīng)過團隊開發(fā)，形成基本的職業(yè)道德規(guī)范和職業(yè)修養(yǎng)，及團隊合作精神。三、內(nèi)容標準第一章HTML網(wǎng)頁基礎(chǔ)教課內(nèi)容一、［教課目標和要求］1、目的：1）掌握HTML文件編寫方法；2）使用閱讀器閱讀HTML源文件；3）認識html基本觀點2、要求：掌握常用的閱讀器翻開網(wǎng)頁方法（IE、火狐、360閱讀器、谷歌閱讀器等），掌握網(wǎng)頁設(shè)計的一些基本觀點；二、［教課要點與難點］要點：網(wǎng)頁設(shè)計有關(guān)觀點難點：網(wǎng)頁設(shè)計有關(guān)屬性三、[教課方法與手段]解說、事例演示、實質(zhì)操作、作業(yè)66v1.0可編寫可改正經(jīng)過理論解說的方式讓學(xué)生認識本章的理論的內(nèi)容四、[內(nèi)容部分]1、經(jīng)典網(wǎng)頁賞識1）藍色代表海洋，宇宙，海洋。是一種廣博的顏色。此網(wǎng)頁采納主色為藍色。代表了一種廣博的精神。也代表了本公司的科技領(lǐng)域強處。不一樣的藍色的變換給人一種輕松的感覺。網(wǎng)頁右側(cè)加以黃色地區(qū)來襯托出產(chǎn)品的外形，以及獨到。網(wǎng)頁整體簡單了然。正是這類公司所需要的。2）網(wǎng)頁是一則汽車的網(wǎng)頁，和傳統(tǒng)汽車網(wǎng)頁同樣采納黑色的背景，突顯出一種尊貴，科技的感覺。文章的文字部分采納高妙度灰色，表現(xiàn)了主題。汽車輪子處的火，表現(xiàn)了激情，興奮。使主題更為生化一步。給人隆重莊重的同時，不失激情活躍的一面。2、網(wǎng)頁設(shè)計有關(guān)觀點1）一致資源定位器（絕對路徑、相對路徑）2）超鏈接3）網(wǎng)站、靜態(tài)網(wǎng)頁、動向網(wǎng)頁、主頁、網(wǎng)頁三劍客4）Html語言觀點5）常有的閱讀器6）Html語言的基本構(gòu)造及語法五、[作業(yè)]1）使用閱讀器翻開網(wǎng)頁源代碼；2）寫出html超文本標記語言的主體構(gòu)造；第二章文字與段落標記教課內(nèi)容77v1.0可編寫可改正一、［教課目標和要求］1、目的：1）掌握網(wǎng)頁中文字編排、美化方法；2）掌握網(wǎng)頁中圖像插入的方法2、要求：1）掌握標題標記2）掌握文本基本標記、文本格式化標記3）掌握段落標記、水平線標記二、［教課要點與難點］要點：掌握文本基本標記、文本格式化標記難點：單、雙標記的劃分三、[教課方法與手段]解說法、事例演示、議論法四、[內(nèi)容部分]1、設(shè)置段落的標記段落標記是一個雙標記，每個標記對表示一個段落；語法格式：<p>這里表示段落</p>2、換行標記換行標記是單標記，即不會成對出現(xiàn)，是在尖括號中加一個</br>的單標記；語法格式：.</br>3、給代碼增添說明增添說明是不會再網(wǎng)頁中顯示的語法格式：<!——說明——>4、粗體和斜體1）粗體標記，是一對雙標記，起到重申的作用88v1.0可編寫可改正語法格式：<b>標題文字</b>2）斜體標記語氣較弱語法格式：<i>表示斜體標記</i>5、下劃線與刪除線標記為了使部分文字特別顯示，能夠使用下劃線或許刪除線標記,也是一對雙標記；語法格式：<u>下劃線的</u><s>刪除線的</s>6、上標和下標雙標記語法格式：^上標_下標H2o;H2so4;a2+b2=c27、文字標記：是一個雙標記語法格式：<fontcolor=”顏色值”>文字</font>8、標題標記對齊屬性h1-h6(h1:表示文字標題最大—h6表示文字標題最小)對齊屬性：align(left、center、right)如：<h1align=“center”>標題居中</h1>9、文本標記的屬性1）字體屬性face如<fontface=“需要的字體”>云南城市建設(shè)職業(yè)學(xué)院</font>設(shè)置字體大小屬性：size如<fontsize=“值”>云南城市建設(shè)職業(yè)學(xué)院</font>絕對值：1-799v1.0可編寫可改正相對值：-4—4的整數(shù)，字體有關(guān)于3號放大和減小字號注意：屬性與屬性之間用空格分開3）字體的顏色屬性:color如<fontcolor=“顏色值”>云南城市建設(shè)職業(yè)學(xué)院</font>能夠用英文單詞或許二進制代碼10、粗體標記：b與strong語法格式：<b>需要加粗的文字</b><strong>需要加粗的文字</strong>標記是能夠嵌套的11、斜體的標記i、em、cite語法格式：<i>需要變成斜體的文字</i><em>需要變成斜體的文字</em><cite>需要變成斜體的文字</cite>12、大字號和小字號標記big和small語法格式<big>需要加大的文字＜／big＞<ｓｍａｌｌ>需要加大的文字＜／ｓｍａｌｌ＞加大：在本來定義的字體大小基礎(chǔ)上加大一個級別；變小：在本來定義的字體大小基礎(chǔ)上變小一個級別；１３、不自動換行的標記1)nobr語法格式：<nobr>不換行的文字</nobr>1010v1.0可編寫可改正14、水平線標記1）<hr/>水平線標記的屬性：width（寬度）、color（顏色）、size（高度）、noshade（無陰影）、align（對齊）15、其余特別標記1）空格： <;<>;>五、[作業(yè)]制作一個公司簡介頁面（包含標題、文字、下劃線、圖片、橫線）第三章使用圖像教課內(nèi)容一、［教課目標和要求］1、目的：1）掌握網(wǎng)頁中圖形圖像的格式；2）掌握網(wǎng)頁中圖像插入的方法及圖像的超鏈接；2、要求：1）掌握常用圖像的格式2）掌握網(wǎng)頁中插入圖像的方法，及插入圖像的標記二、［教課要點與難點］要點：網(wǎng)頁中圖像插入的方法及圖像的超鏈接難點：超鏈接中圖像的地點三、[教課方法與手段]解說法、事例演示、議論法、習(xí)題法1111v1.0可編寫可改正四、[內(nèi)容部分]1、常有的一些圖像格式1）jpeg壓縮圖像格式,不支持透明，1670萬像素，圖像要求比較絢爛的時候使用；2）Gif（圖形互換格式）支持透明，256色，支持動畫（由多張位圖連續(xù)播放形成）3）Png（firework）支持透明1670萬像素，是網(wǎng)絡(luò)可移植格式；2、怎樣在網(wǎng)頁中插入圖像<img>:單標記語法格式：<imgsrc=“地點”>Src：表示指定圖像的地點（路徑）絕對地點：擁有詳盡的地點，即供給目標文檔的完好主機名稱、路徑信息、及文檔的全稱；相對地點：從目前文檔開始的地點1）假如目前文檔和目標文檔地點平行，則直接書寫目標文檔的全稱；2）假如目前文檔和目標文檔文件夾地點平行，則輸入路徑為文件夾名稱目標文檔名稱3）假如目前文檔所在文件夾和目標文檔地點平行，則書寫：目標文檔全稱3、屬性:1）alt屬性語法格式：<imgsrc=“地點”alt=“顯示圖片信息”>2）圖像寬度高度屬性：width、height<imgsrc=“地點”alt=“顯示圖片信息”width=“屬性值”>1212v1.0可編寫可改正3）vspace（垂直間距）、hspace（水平間距）五、[作業(yè)]制作一個圖文并茂的婚紗網(wǎng)頁（素材圖片自己到互聯(lián)網(wǎng)上找）第四章使用列表教課內(nèi)容一、［教課目標和要求］1、目的：1）掌握有序列表；2）掌握無序列表2、要求：1）認識列表標記2）掌握有序、無序、定義、菜單列表的使用方法二、［教課要點與難點］要點：列表標記難點：有序、無序列表浮動的使用三、[教課方法與手段]解說法、事例演示、習(xí)題法四、[內(nèi)容部分]1、列表的使用定義說明：列表是一種數(shù)據(jù)的擺列方式,對頁面的布局特別重要,分為三類:有序列表、無序列表、自定義列表。無序列表：項目符號由幾個符號構(gòu)成有序列表：項目符號由字母、數(shù)字擺列構(gòu)成自定義列表：經(jīng)過自己靈巧定義1）有序列表1313v1.0可編寫可改正語法格式：<ol><li>表示列表項1</li><li>表示列表項2</li><li>表示列表項3</li></ol>難點說明：本列表會自動換行，不用加換行符號，假如非要成一行，那么就給他加上css定義浮動；有序列表的序號種類（1、a、A、i、I）默認狀況下是數(shù)字；語法格式<oltype=“序號種類”><li>表示列表項1</li><li>表示列表項2</li><li>表示列表項3</li></ol>設(shè)置列表的開端數(shù)值<oltype=“序號種類”start=“開端數(shù)值”><li>表示列表項1</li><li>表示列表項2</li><li>表示列表項3</li></ol>注意：start=“開端數(shù)值”中開端數(shù)值一定為數(shù)字，不然不起作用；2）無序列表無序列表的項目擺列沒有次序，以符號作為分項表記；語法格式<ul>1414v1.0可編寫可改正<li>列表項1</li><li>列表項2</li><li>列表項3</li></ul><ul>和</ul>分別表示無序列表的開始和結(jié)束，<li>表示列表項；b)無序列表的列表種類（實心圓、空心圓、方框）disc\circle\square)無開端數(shù)值屬性3）目錄列表顯示成效與無序列表同樣，一般用來創(chuàng)立多列目錄語法格式<dir><li>列表項1</li><li>列表項2</li><li>列表項3</li></dir>種類<dirtype=“種類”><li>列表項1</li><li>列表項2</li><li>列表項3</li></dir>列表種類（實心圓、空心圓、方框）disc\circle\square)無開端數(shù)值屬性4）定義列表語法格式<dl>13211515v1.0可編寫可改正<dt>定義條件1</dt><dd>定義描繪1</dd><dt>定義條件2</dt><dd>定義描繪2</dd><dt>定義條件3</dt><dd>定義描繪3</dd></dl>5）菜單列表用于設(shè)計單列菜單列表，顯示成效與無序列表同樣；語法格式：<menu><li>列表項1</li><li>列表項2</li><li>列表項3</li></menu>五、[作業(yè)]1、輸入五組列表（無序、有序、自定義、菜單、目錄列表）代碼；并給每組第一個列表項加上超鏈接，鏈接目標自定。第五章使用表格教課內(nèi)容一、［教課目標和要求］1、目的：1）掌握創(chuàng)立表格的方法；2）掌握表格屬性2、要求：1）掌握創(chuàng)立表格方法；1616v1.0可編寫可改正2）掌握表格邊框、背景、行、列屬性二、［教課要點與難點］要點：創(chuàng)立表格難點：歸并單元格三、[教課方法與手段]解說法、事例演示、習(xí)題法、問題法四、[內(nèi)容部分]1、成立表格用到的四個標記1）table,是雙標記，用于定義表格元素，<table>和</table>;2）tr是雙標記，用于定義表格的行；<tr>和</tr〉3）td是雙標記，用于定義表格的單元格；<td>和</td>4）th是雙標記，用于定義表頭;<th>和</th>2、語法格式<table><tr><th>第一行第一列單元格</th><th>第一行第一列單元格</th><th>第一行第一列單元格</th></tr><tr><th>第一行第一列單元格</th><th>第一行第一列單元格</th><th>第一行第一列單元格</th></tr></table>1717v1.0可編寫可改正姓名性別年紀張三豐男25總結(jié)：<th>與</th>表示表頭，里面的內(nèi)容，自動加粗、自動居中；<td>和</td>表示單元格，里面的內(nèi)容不加粗，不居中；3、<table>標記屬性1）、border:表示表格的邊框?qū)傩?，屬性值為?shù)值；border="數(shù)值"；）、width：表示表格寬度屬性（屬性值示數(shù)值或許百分比））、height：表格高度屬性（屬性值示數(shù)值或許百分比）4）、bgcolor:設(shè)置表格背景顏色的屬性屬性值能夠是英文單詞、也能夠是rgb或許cmyk顏色值）、background:用于設(shè)置表格背景圖像屬性；屬性值：就是設(shè)置背景路徑值（建議使用相對路徑）6）、cellspacing:用來設(shè)置表格間距，屬性值是數(shù)值；7）、cellpadding：用來設(shè)置表格邊距，屬性值是數(shù)值；8）align:用于設(shè)置表格對齊的屬性：屬性值：left\right\center(左對齊、右對齊、居中對齊)4、表格行的控制）width：表示行的寬度（屬性值示數(shù)值或許百分比））height：行高度屬性（屬性值示數(shù)值或許百分比））align：設(shè)置行中文字對齊方式；）vlign：文字垂直方向?qū)R）bgcolor:設(shè)置表格行背景顏色的屬性屬性值能夠是英文單詞、也能夠是rgb或許cmyk顏色值6）bordercolor：設(shè)置表格行邊框顏色5、td單元格的屬性控制1）align、vlign：單元格中水平、垂直方向文字對齊方式；1818v1.0可編寫可改正2）bordercolor：單元格邊框?qū)傩裕゜gcolor：單元格背景顏色）rowspan：表示單元格跨行的行數(shù)）colspan：表示單元格跨列的列數(shù)五、[作業(yè)]作業(yè)1、用html標記語言中表格標記和屬性等達成上圖所示表格；2、用html標記語言中表格標記和屬性等達成本班級課程表；第六章使用成立超鏈接教課內(nèi)容一、［教課目標和要求］1、目的：1）掌握超鏈接的基本知識；2）掌握超鏈接成立方法2、要求：1）掌握網(wǎng)頁內(nèi)部鏈接方法；1919v1.0可編寫可改正2）掌握網(wǎng)頁外面鏈接方法；3）掌握錨點鏈接方法二、［教課要點與難點］要點：外面鏈接、內(nèi)部鏈接方法難點：鏈接時路徑的正確書寫三、[教課方法與手段]解說法、事例演示、習(xí)題法四、[內(nèi)容部分]1、路徑的觀點：路徑分為相對路徑和絕對路徑相對路徑以引用文件的網(wǎng)頁所在的地點為參照基礎(chǔ)而成立的路徑如：1)假如鏈接到同一目錄下，則直接輸入要鏈接的文檔的名稱；2)假如鏈接到下一級目錄中的文件，則先輸入目錄名，而后再加“/”，在輸入文件名假如鏈接到上一級目錄中的文件，先輸入“../”再輸入目錄名、文件名絕對路徑（）絕對路徑是以站點的根目錄為參照基礎(chǔ)的目錄路徑在www中以http開頭的鏈接都是絕對路徑說明：當鏈接到本機器上的文件時，建議使用相對路徑，假如使用絕對路徑，當把文件挪動到其余盤符后，那么鏈接就會無效，這樣就要對文件鏈接從頭編寫才能使用。3、成立超級鏈接文字1）格式<a>要鏈接的文字</a><ahref=“路徑”>要鏈接的文字</a><a>:表示鏈接的開始2020v1.0可編寫可改正</a>：鏈接的結(jié)束href：定義文件鏈接的地點（路徑、地點）2）Target用于指定翻開鏈接的目標窗口，默認方式是在本來的窗口中翻開-blank:在閱讀器新的窗口中翻開；-parent：將鏈接的文件載入含有該鏈接框架的副窗口中翻開；-self：在同一框架中翻開-top：在目前整個閱讀器窗口中翻開格式：<ahref=“路徑”target=“-blank”>要鏈接的文字</a>圖像的鏈接要將圖片做成超鏈接，只要將<img>標記放在<a>和</a>之間即可；格式：<ahref=“鏈接圖片地點”><imgscr=“參數(shù)”></a>郵箱的鏈接格式：<ahref=“mailto：E-mail地點”cc=“抄送人E-mail地點”&subject=“郵件主題”&body=“郵件正文”>描繪文字</a>如：<ahref=“mailto”cc=“”&subject=“祝愿”&body=“十一節(jié)快樂”>寫信</a>站內(nèi)鏈接假如一個頁面很長，找尋相應(yīng)內(nèi)容比較困難，就能夠使用站內(nèi)鏈接格式：<ahref=“#目標名稱”target=“窗口名稱”>目錄文字</a>在鏈接的目標處使用<aname=“目標名稱”>超鏈接目標</a>五、[作業(yè)]2121v1.0可編寫可改正1、做一個腦筋急轉(zhuǎn)彎頁面的站內(nèi)鏈接（起碼10個）2、做一個圖片鏈接頁面3、做一個文字鏈接頁面（標題的）第七章增添多媒體教課內(nèi)容一、［教課目標和要求］1、目的：1）掌握常有的媒體文件格式；2）掌握插入多媒體方法2、要求：1）設(shè)置轉(zhuǎn)動文字方法；2）掌握插入音頻、視頻文件方法；3）掌握設(shè)置網(wǎng)頁背景音樂方法二、［教課要點與難點］要點：音頻、視頻文件方法難點：轉(zhuǎn)動文字設(shè)置、鼠標控制（停止、運動）三、[教課方法與手段]解說法、事例演示、習(xí)題法、發(fā)問法四、[內(nèi)容部分]、轉(zhuǎn)動字幕使用轉(zhuǎn)動字幕能夠增添網(wǎng)頁的動感,讓網(wǎng)頁顯得更有生氣,達到動感實足的成效;<marquee>是一個雙標記語法格式:<marquee>文字</marquee>屬性:direction、beavior、loop、scroollamount、scrolldelay、align、bgcolor、2222v1.0可編寫可改正height和width、hspace和vspace1）direction：用于設(shè)置轉(zhuǎn)動文字挪動方向?qū)傩灾担簂eft（右向左挪動）默認值right(左向右挪動)up（下往上挪動）down（上往下挪動）2）behavior：用于轉(zhuǎn)動文字的挪動成效；屬性值：Scroll：周而復(fù)始轉(zhuǎn)動；Slide：表示轉(zhuǎn)動到一方后停止，只轉(zhuǎn)動一次；alternate：表示轉(zhuǎn)動一方后向相反方向轉(zhuǎn)動，交替進行3）loop：用于設(shè)置轉(zhuǎn)動文字的循環(huán)次數(shù)，假如未指定，則循環(huán)不只；4）scrolldelay：用于設(shè)置每次轉(zhuǎn)動的間隔的延緩時間，一般以毫秒作為單位5）align：用于設(shè)置轉(zhuǎn)動文字的對齊方式top：頂對齊middle：中間對齊bottom：底部對齊6）bgcolor:用于設(shè)置轉(zhuǎn)動的背景顏色；7）height和width用于設(shè)置轉(zhuǎn)動文字的高度和寬度8）hspace和vspace用于設(shè)置轉(zhuǎn)動文字周圍的水憑空間和垂直空間怎樣實現(xiàn)鼠標光標挪動到滾文字上停止轉(zhuǎn)動；移開鼠標連續(xù)轉(zhuǎn)動成效；Onmouseover=“javascript：()”表示鼠標經(jīng)過停止；Onmouseout=“javascript：()”表示鼠標移開連續(xù)運動；2、怎樣嵌入多媒體文件：2323v1.0可編寫可改正網(wǎng)頁中嵌入的多媒體不只有文字、圖像還有音頻、視頻、flash動畫等文件1）使用<embed>標記嵌入多媒體文件（是一個單標記）屬性說明：src用于指定媒體文件的地點Height和width用于設(shè)置媒體文件的高度和寬度Loop用于設(shè)置媒體文件的播放次數(shù)Hidden用于隱蔽播放器五、[作業(yè)]、制作一網(wǎng)頁，在網(wǎng)頁中插入轉(zhuǎn)動文字、視頻、音頻文件（素材自備）第八章使用表單教課內(nèi)容一、［教課目標和要求］1、目的：1）掌握表單標記；2）掌握菜單和列表使用方法；3）掌握文本框、文本域使用方法2、要求：1）熟習(xí)表單對象；2）熟習(xí)表單標記及其屬性；二、［教課要點與難點］要點：表單觀點、表單對象成立方法難點：密碼框成立、菜單、復(fù)選框成立方法三、[教課方法與手段]解說法、事例演示、習(xí)題法、發(fā)問法四、[內(nèi)容部分]2424v1.0可編寫可改正1、成立表單1）表單是實現(xiàn)交互式動向網(wǎng)頁的一種主要的外在形式，是網(wǎng)站管理者與瀏覽者之間交流的橋梁，其主要功能是采集信息；由<form>標記來定義；2）格式<from>..</form>屬性共有三個name屬性：“form-name”method屬性：get和postaction屬性：表單辦理程序的地點3）輸入標記<input>標記是表單中輸入標記，是一個單標記，語法格式以下：<inputname=“”file-name”type=“type-name”>4）文本框單行文本框：當type的屬性值為“text”時表示輸入項輸入的字符串是以單行顯示；value：定義文本框初始值size：定義文本框長度maxlength：定義輸入最大字符串數(shù)如：聯(lián)系方式：電子郵件：聯(lián)系地點：手機號碼：電話號碼：QQ：5）密碼框如：用戶登錄2525v1.0可編寫可改正用戶名：輸入密碼：當type屬性的值：為password時表示的是密碼框，其余屬性與text相像，不一樣之處，輸入的內(nèi)容均以*表示，保證密碼的安全性語法格式：<inputtype=“password”name=“”file-name”maxlength=“數(shù)值”>2、按鈕表單中的按鈕起著至關(guān)重要的作用，主要有三種種類：一般按鈕、提交按鈕、重置按鈕；1）一般按鈕當type的屬性值為button時表示該輸入項輸入的是一般按鈕，語法格式以下：<inputtype=“button”name=“file-name”value=“button-value”>注意：value表示顯示在按鈕上邊的文字2）提交按鈕當type的屬性值為submit時表示該輸入項輸入的是提交按鈕，語法格式以下：<inputtype=“submit”name=“file-name”value=“submit-value”>3）重置按鈕當type的屬性值為reset時表示該輸入項輸入的是重置按鈕，語法格式以下：<inputtype=“reset”name=“file-name”value=“reset-value”>3、單項選擇框與復(fù)選框1）單項選擇框當type的屬性值為radio時表示該輸入項輸入的是單項選擇項，語法格式以下：<inputtype=“radio”name=“file-name”value=“value”>2626v1.0可編寫可改正2）復(fù)選框當type的屬性值為checkbox時表示該輸入項輸入的是復(fù)選項，語法格式如下：<inputtype=“checkbox”name=“file-name”value=“value”>4、文件輸入框當type的種類為file表示輸入項是一個文件輸入框，用戶能夠在文件輸入框內(nèi)部填寫自己硬盤中文件的路徑，而后經(jīng)過表單上傳；格式：<inputtype=“file”name=“file-name”>五、[作業(yè)]、使用表單標記創(chuàng)立以下密碼框用戶登錄用戶名：輸入密碼：第九章使用框架構(gòu)造教課內(nèi)容一、［教課目標和要求］1、目的：1）掌握框架的使用方法；2）框架的屬性；2、要求：1）掌握框架的使用方法；2）掌握框架的鏈接；二、［教課要點與難點］要點：框架的屬性難點：框架的鏈接2727v1.0可編寫可改正三、[教課方法與手段]解說法、事例演示、習(xí)題法四、[內(nèi)容部分]框架的作用：往常用于頁面導(dǎo)航；框架1、框架集<frameset>..<frameset>2、框架<frame><frame>框架集：用<frameset>..<frameset>標記來定義，用于定義網(wǎng)頁顯示的框架數(shù)目、大小等其余屬性；框架：用<frame><frame>標記定義，定義的是網(wǎng)頁上一個顯示的地區(qū)3、語法格式：<html><head><title>.</title></head><frameset><framesrc=“url”/><frameset><html>說明：框架文檔的書寫格式與和html文檔的書寫格式基真同樣，獨一不一樣的是使用frameset標記替代了body標記4、框架構(gòu)造1）左右構(gòu)造2）上下構(gòu)造3）嵌套構(gòu)造左右構(gòu)造：采納cols屬性，即在垂直方向?qū)㈤喿x器切割成多個窗口2828v1.0可編寫可改正語法格式：<framesetcols=“value”，“value”，.><framesrc=“url”/><framesrc=“url”/></frameset>Value值能夠是數(shù)值也能夠是百分比，還能夠混淆；數(shù)值之間用逗號“，”進行切割，有幾個值則說明窗口就被切割成幾個部分；上下構(gòu)造：采納rows屬性，即在水平方向?qū)㈤喿x器切割成多個窗口語法格式：<framesetrows=“value”，“value”，.><framesrc=“url”/><framesrc=“url”/></frameset>比如：將網(wǎng)頁頁面水平切割成三個部分（10%，20%，60%）嵌套構(gòu)造：既有左右切割，有上下切割語法格式：<framesetrows=“value”，“value”，.><framesrc=“url”/>.<framesetcols=“value”，“value”，.><framesrc=“url”/></frameset></frameset>2929v1.0可編寫可改正例：將網(wǎng)頁切割成田字形2、框架集的屬性設(shè)置窗口框架寬度border語法格式：<framesetrows=“value”，“value”，.Border“”><framesrc=“url”/><framesrc=“url”/></frameset>設(shè)置邊框顏色bordercolor語法格式：<framesetrows=“value”，“value”，.border=“value”bordercolor=“color-value”><framesrc=“url”/><framesrc=“url”/></frameset>設(shè)置框架隱蔽frameborder語法格式：<framesetcols=“value”，“value”，.frameborder=“值”><framesrc=“url”/><framesrc=“url”/></frameset>值為：0或許1，0表示不顯示邊框，1表示顯示邊框，默認狀況下值為13、框架屬性3030v1.0可編寫可改正scr：用于設(shè)置框架顯示的文件路徑；語法格式：framesrc=“url”/>，假如沒有src屬性則表示該窗口顯示為空白name用于定義框架的名稱語法格式：<framesrc=“url”name=“”/>frameborder屬性用于顯示框架，值與框架集同樣scrolling屬性用于設(shè)定能否有轉(zhuǎn)動條value值有兩個“yes”和“no”“auto”語法格式：<framesrc=“url”name=“”scrolling=“vlue”/>noresize屬性用于用戶可否自己調(diào)整框架窗口大小語法格式：<framesrc=“url”name=“”scrolling=“vlue”noresize/>注意：此屬性無屬性值marginwidth屬性，用于設(shè)定內(nèi)容與框架的距離語法格式：<framesrc=“url”name=“”marginwidth=“vlue”/>marginheight屬性，用于設(shè)定框架邊沿高度語法格式：<framesrc=“url”name=“”marginheight=“vlue”/>五、[作業(yè)]1、用框架將頁面切割成左右兩個部分（20%，80%），而后再把右部上下切割成相等兩個部分，并設(shè)置左側(cè)框架名稱為left，并且左側(cè)框架窗口顯示轉(zhuǎn)動條，右側(cè)窗口不顯示轉(zhuǎn)動條，左側(cè)框架上部分連結(jié)到右框架上部分接到；第十章使用css款式表教課內(nèi)容一、［教課目標和要求］3131v1.0可編寫可改正1、目的：1）掌握css款式表使用方法；2）掌握css分類；3）屬性的使用2、要求：1）css款式表使用；2）掌握css分類及其屬性；二、［教課要點與難點］要點：款式表的使用難點：款式表的名稱定義三、[教課方法與手段]解說法、事例演示、習(xí)題法四、[內(nèi)容部分]、認識cssCss又稱層疊款式表，是一種此刻大家都使用的網(wǎng)頁技術(shù)，為大多閱讀器支持，成為網(wǎng)頁設(shè)計必不行少的工具；2、款式表構(gòu)成）選擇符此組款式編碼所要針對的對象，能夠是一個標記如（body，h1等），也能夠是定義了的id或class標記；2）款式屬性：顏色、大小、定位、浮動等3）值：指定值、數(shù)字、百分比3、款式表種類外聯(lián)款式表、內(nèi)聯(lián)款式表、內(nèi)嵌款式表4、語法格式如：3232v1.0可編寫可改正）<pclass=“h”>.</p>款式表格式：.h{..}<pid=“h”>.</p>款式表格式：#h{..}五、[作業(yè)]1、應(yīng)用外聯(lián)款式表對頁面進行簡單布局；四、《網(wǎng)頁設(shè)計》實訓(xùn)部分1、實訓(xùn)目的與要求《網(wǎng)頁設(shè)計dreamwvaver綜合實訓(xùn)》主要目的是讓學(xué)生經(jīng)過這門實踐課程的學(xué)習(xí)了解和掌握網(wǎng)頁設(shè)計的基本方法和技巧，經(jīng)過不停上機實踐訓(xùn)練達到能夠嫻熟順利達成網(wǎng)站的制作。掌握網(wǎng)站設(shè)計流程、技巧，集中實踐使學(xué)生綜合運用所學(xué)習(xí)的網(wǎng)頁設(shè)計知識及從前所學(xué)習(xí)的計算機方面的知識，依照網(wǎng)站制作的流程，達成一個詳細、綜合性的網(wǎng)站；穩(wěn)固學(xué)生系統(tǒng)性的知識，培育學(xué)生解決實質(zhì)問題的能力，鍛煉互相合作的工作能力，提升學(xué)生綜合素質(zhì)。2、實訓(xùn)內(nèi)容1）實例實訓(xùn)（綠色食品、手機、餐飲、美容）以綠色食品網(wǎng)站設(shè)計的實例指導(dǎo)學(xué)生怎樣獨立達成食品網(wǎng)站站點的設(shè)計和制作。讓學(xué)生在機房實質(zhì)操作，依照給定的實例達成實例中整個站點頁面的創(chuàng)立和設(shè)計。2）自建站點實訓(xùn)（綠色食品、手機、餐飲、美容）讓學(xué)生自行選擇站點的主題，從規(guī)劃站點到一步一步達成整個站點的規(guī)劃、設(shè)計、創(chuàng)立、調(diào)試等工作。3）總結(jié)3333v1.0可編寫可改正對學(xué)生的所有作品進行批閱，并選擇事例對實訓(xùn)的結(jié)果進行查核。3、參照步驟實訓(xùn)內(nèi)容實訓(xùn)課時實訓(xùn)說明、知識回首基本知識回首實訓(xùn)作品策劃、規(guī)劃書整體布局設(shè)計采集和創(chuàng)立資源成效圖制作程序設(shè)計首頁模板設(shè)計二級頁面模板設(shè)計各頁面的細化、測試改正文檔總結(jié)4、實訓(xùn)準備1）軟件準備Dreamweaver、firework、PhotoShop、logomaker、Flash中文版（本實訓(xùn)對FLASH技術(shù)不做要求）。2）硬件準備網(wǎng)絡(luò)條件：與因特網(wǎng)連結(jié)的局域網(wǎng)。（最好不帶復(fù)原的計算機）教師用機：Windowsxp或win7及以上版本。學(xué)生用機：Windowsxp或win7及以上版本。5、考查方法網(wǎng)站規(guī)劃書10分成效圖設(shè)計20分編寫代碼30分3434v1.0可編寫可改正實訓(xùn)出勤20分技術(shù)含量10分整體雅觀一致搭配10分6、實訓(xùn)內(nèi)容說明由實訓(xùn)指導(dǎo)教師自行選擇網(wǎng)站作為實例，實例要求以下：選擇公司綠色食品網(wǎng)站或許其余公司網(wǎng)站。站點模塊功能清楚，能反應(yīng)各模塊的基本功能、構(gòu)造清楚、風(fēng)格一致、色彩一致。為了便于教課，站點應(yīng)當擁有大熱dreamweaver頁面布局、鏈接、CSS+div樣式等網(wǎng)頁設(shè)計制作中常用的知識點和操作。7、內(nèi)容1）解說和演示整個站點的制作過程和設(shè)計方法。2）、學(xué)生自由組隊（三人一組分工合作），也能夠一人一組，最多不超出三人。8、實訓(xùn)步驟（學(xué)生實訓(xùn)周內(nèi)達成）1）達成整個站點規(guī)劃（規(guī)劃書）、包含色彩、logo站點風(fēng)格策劃；2）素材、文檔資料采集3）成效圖制作（firework或ps、flash）4）頁面設(shè)計、頁面布局（dreamweaver、css+div）5）程序設(shè)計、調(diào)試6）模板成立7）應(yīng)用模板生成有關(guān)二級頁面8）測試鏈接等達成站點成立9）總結(jié)除內(nèi)容外還包含對在實訓(xùn)中有什么收獲、有什么困難等內(nèi)容五、實行建議教課建議3535v1.0可