中高職銜接是構(gòu)建現(xiàn)代教育體系的關(guān)鍵。本書是中高職銜接課程體系建設(shè)項(xiàng)目網(wǎng)頁設(shè)計(jì)與制作課程的配套教材,編者在總結(jié)近幾年教學(xué)改革經(jīng)驗(yàn)的基礎(chǔ)上,按照中高職銜接計(jì)算機(jī)應(yīng)用技術(shù)專業(yè)一體化人才培養(yǎng)方案的要求編寫而成。 本書采用單元模塊化的編寫思路,將HTML語言、CSS樣式和Dreamweaver軟件三方面的知識內(nèi)容分配到10個(gè)教學(xué)單元中,從網(wǎng)頁設(shè)計(jì)制作的基礎(chǔ)知識入手,深入淺出、循序漸進(jìn)地講述了基于Web標(biāo)準(zhǔn)、使用HTML DIV CSS進(jìn)行網(wǎng)頁設(shè)計(jì)制作的相關(guān)理論和技術(shù)。
每個(gè)單元模塊首先引出單元的主要學(xué)習(xí)內(nèi)容,接著進(jìn)行任務(wù)學(xué)習(xí),zui后有相應(yīng)的課后實(shí)訓(xùn)和單元小結(jié)。每個(gè)任務(wù)的編寫分為任務(wù)描述、知識準(zhǔn)備、任務(wù)實(shí)現(xiàn)和任務(wù)拓展四個(gè)環(huán)節(jié),使讀者在循序漸進(jìn)學(xué)習(xí)的同時(shí)掌握網(wǎng)頁設(shè)計(jì)相關(guān)的知識技能。
本書知識點(diǎn)全面,結(jié)構(gòu)合理,實(shí)用性強(qiáng),適合作為高等職業(yè)院校網(wǎng)頁設(shè)計(jì)課程的教材,也可作為培訓(xùn)機(jī)構(gòu)的短期培訓(xùn)教材和網(wǎng)頁設(shè)計(jì)愛好者的參考書。
本書在編寫過程中以中高職銜接課程資源建設(shè)與共享為出發(fā)點(diǎn),全書主要包含HTML語言、CSS樣式、Dreamweaver軟件的使用三方面的知識。
隨著Internet的快速發(fā)展,網(wǎng)頁界面更加美觀,頁面代碼更加簡潔精致,頁面布局都向W3C標(biāo)準(zhǔn)靠近,HTML和CSS相結(jié)合是靜態(tài)頁面布局的重要組合。本書在編寫過程中以中高職銜接課程資源建設(shè)與共享為出發(fā)點(diǎn),全書主要包含HTML語言、CSS樣式、Dreamweaver軟件的使用三方面的知識。從網(wǎng)頁設(shè)計(jì)制作的基礎(chǔ)知識入手,深入淺出、循序漸進(jìn)地講述了基于Web標(biāo)準(zhǔn)、使用HTML DIV CSS進(jìn)行網(wǎng)頁設(shè)計(jì)制作的相關(guān)理論和技術(shù),將知識和技能要點(diǎn)融于一個(gè)個(gè)任務(wù)中,每個(gè)任務(wù)分為任務(wù)描述、知識準(zhǔn)備、任務(wù)實(shí)現(xiàn)、任務(wù)拓展四個(gè)環(huán)節(jié)。本書中的任務(wù)設(shè)計(jì)遵循簡明、易學(xué)、實(shí)用的原則,在知識準(zhǔn)備環(huán)節(jié),詳細(xì)介紹實(shí)現(xiàn)任務(wù)的相關(guān)HTML和CSS知識點(diǎn);在任務(wù)實(shí)現(xiàn)環(huán)節(jié),以通俗易懂的語言,配以圖文并茂的操作步驟,詳細(xì)講解任務(wù)的實(shí)現(xiàn)過程;在任務(wù)拓展環(huán)節(jié),介紹Dreamweaver CS6軟件拓展知識,以提高學(xué)生的知識素養(yǎng);在課后實(shí)訓(xùn)環(huán)節(jié),通過實(shí)訓(xùn)練習(xí),鞏固所學(xué)知識,加強(qiáng)對學(xué)生網(wǎng)頁操作技能的培養(yǎng)。本書適合作為高職高專院校計(jì)算機(jī)專業(yè)和非計(jì)算機(jī)專業(yè)的網(wǎng)頁設(shè)計(jì)與制作課程的教材,也可以作為網(wǎng)頁設(shè)計(jì)與制作人員的自學(xué)用書和參考書。本書由蘇文和陳海峰任主編,王學(xué)卿、程琦峰、殷美和包佃清任副主編。蘇文編寫單元1、單元2、單元5、單元10和全書課后實(shí)訓(xùn)內(nèi)容。陳海峰編寫單元3、單元4、單元8和單元9。王學(xué)卿、包佃清、程琦峰和殷美編寫單元6和單元7。全書統(tǒng)稿工作由蘇文完成。參與本書編寫的人員均為專業(yè)資深教師,但由于時(shí)間倉促,編者水平有限,書中疏漏、不足之處在所難免,懇請讀者和教學(xué)同仁批評指正,以便再版時(shí)予以修訂。讀者在學(xué)習(xí)過程中,如遇到困難,可以聯(lián)系作者(電子郵箱:lygqing320@163.com)。zui后,我們要向所有對本書寫作做出貢獻(xiàn)的同仁表示感謝。
編 者 2018年8月
蘇文,連云港職業(yè)技術(shù)學(xué)院。
陳海峰,連云港職業(yè)技術(shù)學(xué)院。
單元1 網(wǎng)頁設(shè)計(jì)基礎(chǔ)知識 1
任務(wù)1 訪問網(wǎng)站www.lygtc.edu.cn 1
任務(wù)描述 1
一、網(wǎng)頁與網(wǎng)站 1
二、頁面布局設(shè)計(jì)與色彩搭配 3
三、網(wǎng)頁制作常用軟件和技術(shù) 5
任務(wù)實(shí)現(xiàn) 6
任務(wù)拓展 7
任務(wù)2 創(chuàng)建本地站點(diǎn) 8
任務(wù)描述 8
一、Dreamweaver CS6軟件 8
二、Dreamweaver CS6站點(diǎn) 13
任務(wù)實(shí)現(xiàn) 15
任務(wù)拓展 16
課后實(shí)訓(xùn) 19
單元小結(jié) 20
單元2 HTML基礎(chǔ) 21
任務(wù)1 制作圖文混排網(wǎng)頁 21
任務(wù)描述 21
一、HTML基本概念 22
二、文本排版 23
三、水平線標(biāo)簽
四、圖像標(biāo)簽 26
任務(wù)實(shí)現(xiàn) 27
任務(wù)拓展 29
任務(wù)2 表格的使用 33
任務(wù)描述 33
一、表格 33
二、超鏈接 37
三、列表 41
任務(wù)實(shí)現(xiàn) 44
任務(wù)拓展 46
課后實(shí)訓(xùn) 48
單元小結(jié) 49
單元3 HTML高級應(yīng)用 50
任務(wù)1 表單頁面設(shè)計(jì) 50
任務(wù)描述 50
一、表單 50
二、表單控件 53
任務(wù)實(shí)現(xiàn) 62
任務(wù)拓展 63
任務(wù)2 框架多媒體頁面設(shè)計(jì) 64
任務(wù)描述 64
一、框架 65
二、插入多媒體對象 69
任務(wù)實(shí)現(xiàn) 70
任務(wù)拓展 73
課后實(shí)訓(xùn) 75
單元小結(jié) 76
單元4 CSS的基礎(chǔ)知識 77
任務(wù) CSS的引用制作風(fēng)景頁面 77
任務(wù)描述 77
一、CSS概述 78
二、CSS的引用方法 79
三、CSS選擇器 82
任務(wù)實(shí)現(xiàn) 87
任務(wù)拓展 89
課后實(shí)訓(xùn) 92
單元小結(jié) 93
單元5 設(shè)置CSS文本、圖像和背景 94
任務(wù) 使用樣式美化網(wǎng)頁 94
任務(wù)描述 94
一、CSS文本相關(guān)樣式 94
二、CSS背景屬性 98
任務(wù)實(shí)現(xiàn) 102
任務(wù)拓展 102
課后實(shí)訓(xùn) 104
單元小結(jié) 105
單元6 盒子模型 106
任務(wù) 海天醬頁面布局 106
任務(wù)描述 106
一、初識盒子模型 107
二、盒子模型相關(guān)屬性 107
三、盒子之間的關(guān)系 115
四、盒子在標(biāo)準(zhǔn)流中的
定位原則 116
任務(wù)實(shí)現(xiàn) 120
任務(wù)拓展 122
課后實(shí)訓(xùn) 123
單元小結(jié) 123
單元7 盒子的定位和浮動(dòng) 124
任務(wù) 美食頁面布局 124
任務(wù)描述 124
一、盒子的浮動(dòng) 125
二、盒子的定位 129
任務(wù)實(shí)現(xiàn) 134
任務(wù)拓展 139
課后實(shí)訓(xùn) 142
單元小結(jié) 143
單元8 用CSS設(shè)置列表和鏈接 144
任務(wù) 通知公告頁面 144
任務(wù)描述 144
一、設(shè)置項(xiàng)目列表樣式 144
二、設(shè)置超鏈接 149
任務(wù)實(shí)現(xiàn) 150
任務(wù)拓展 152
課后實(shí)訓(xùn) 156
單元小結(jié) 156
單元9 常用布局結(jié)構(gòu) 157
任務(wù) 綠色滿園花卉網(wǎng)站 157
任務(wù)描述 157
一、布局流程 158
二、常見布局 159
任務(wù)實(shí)現(xiàn) 166
任務(wù)拓展 173
課后實(shí)訓(xùn) 174
單元小結(jié) 174
單元10 綜合案例教務(wù)網(wǎng)站設(shè)計(jì) 176
任務(wù)描述 175
一、內(nèi)容分析 176
二、HTML結(jié)構(gòu)設(shè)計(jì) 176
三、原型設(shè)計(jì) 177
四、頁面方案 178
任務(wù)實(shí)現(xiàn) 179
任務(wù)拓展 189
課后實(shí)訓(xùn) 190
單元小結(jié) 190