|
關于我們
 書單推薦 新書推薦 |
Web前端開發(fā)必知必會 
定 價：53 元
9 7 4 8 7 7 5 1 4 2 4 1 3 讀者對象:電子信息類專業(yè)的學生，電子商務、機電等專業(yè)學生，中外合作相關專業(yè)留學生，Web前端開發(fā)愛好者、自學者 
本教材共分18課（章），每課根據(jù)實際情況需要3～8個學時，第1課到第10課，主要介紹了HTML基本框架，標簽與屬性，CSS樣式基礎，教會讀者利用盒子模型，結合HTML5結構化標簽，建立基本的頁面框架，以及固定寬度布局的模板網(wǎng)頁，第11～16課介紹了JavaScript特效應用、表單、響應式設計、彈性圖像與彈性布局、flexbox伸縮盒等實際Web前端開發(fā)必備的知識點，并輔助以若干個對應知識點的網(wǎng)頁實例；第17課~18課則介紹了網(wǎng)站建設的基本規(guī)范、API工具等，便于讀者后續(xù)的學習與實踐。讀者在學習了第1～10課后，將初步掌握Web頁面制作基礎，然后繼續(xù)學習后續(xù)的課程章節(jié)，學習實際Web前端開發(fā)應用必備的知識，通過涵蓋各個知識點的案例進行實踐，快速、高效地掌握實用網(wǎng)頁制作的基本方法。另外，將另外提供教材中涉及的全部網(wǎng)頁源代碼網(wǎng)絡資源，方便社會讀者自學。
張怡芳，浙江機電職業(yè)技術學院副教授。曾主持建筑結構智能化設計及其技術規(guī)范研究（浙江省教育廳，2002.06-2004.06）、建筑CAD圖形智能識別技術研究（浙江萬里學院重點，2002.04-2005.04）等科研項目，以及信管專業(yè)"WEB前端設計”漸進式課程教學改革探索（機電學院重點項目，2015.06）等教改項目。所參與的"漸進式‘Web前端設計’與成長型思維訓練教學探索”榮獲浙江省計算機應用與教育學會教育委員會第20屆年會優(yōu)秀論文。曾出版《計算機圖形學基礎及應用教程》等。
第1 課 Web 前端簡介 1
1.1 Web 前端與HTML ............................2 1.1.1 什么是Web 前端 ..........................2 1.1.2 Web 是如何工作的 .......................2 1.1.3 網(wǎng)站與HTML 網(wǎng)頁 ......................3 1.1.4 網(wǎng)站類型 ........................................3 1.2 HTML 文件結構 ................................5 1.3 網(wǎng)頁三要素：結構、表現(xiàn)、行為 ....6 1.4 網(wǎng)頁編碼工具 ....................................8 1.4.1 使用記事本編寫網(wǎng)頁代碼 ............8 1.4.2 瀏覽器的開發(fā)者工具 ....................8 1.4.3 IDE 簡介 ......................................10 1.4.4 HBuilderX 環(huán)境 ...........................10 1.5 每課小練 ..........................................12 1.5.1 練一練： 制作帶圖像的簡單網(wǎng) 頁..................................................12 1.5.2 試一試：制作航天新聞網(wǎng)頁 ......14 1.5.3 常見問題Q＆A ............................16 1.6 理論習題 ..........................................16 第2 課 常用的HTML 標簽及其屬性 18 2.1 常用的標簽 ......................................19 2.1.1 什么是標簽 ..................................19 2.1.2 標簽的屬性 ..................................21 2.2 特殊符號 ..........................................22 2.3 表格 ..................................................23 2.4 圖像 ..................................................25 2.4.1 內容圖像 ......................................25 2.4.2 背景圖像 ......................................25 2.5 每課小練 ..........................................26 2.5.1 練一練：基本標簽的應用 ..........26 2.5.2 試一試：圖像與表格 ..................28 2.5.3 常見問題Q＆A ............................32 2.6 理論習題 ..........................................32 第3 課 超鏈接與路徑 34 3.1 超鏈接 ..............................................35 3.1.1 超鏈接標簽及其屬性 ..................35 3.1.2 錨記 ..............................................35 3.2 路徑 ..................................................36 3.2.1 絕對路徑 ......................................36 3.2.2 相對路徑 ......................................37 3.3 每課小練 ..........................................38 3.3.1 練一練：簡單超鏈接 ..................38 3.3.2 學以致用：再別康橋網(wǎng)頁 ..........39 3.3.3 常見問題Q＆A ............................41 3.4 理論習題 ..........................................42 第4 課 簡單CSS 43 4.1 CSS 樣式概述 ..................................44 4.1.1 CSS 樣式的作用..........................44 4.1.2 什么是選擇器 ..............................44 4.1.3 CSS 選擇器類型............. 47 4.1.4 基本選擇器命名規(guī)則 ..................49 4.2 顏色模型 ..........................................49 4.3 設置網(wǎng)頁的文本顏色與背景顏色 ..52 4.3.1 設置文本顏色 ..............................52 4.3.2 設置背景顏色 ..............................52 4.3.3 使用拾色器 ..................................53 4.3.4 設置背景圖像 ..............................53 4.4 每課小練 ..........................................55 4.4.1 練一練：標簽選擇器練習 ..........55 4.4.2 練一練：制作基本網(wǎng)頁模板 ......58 4.4.3 學以致用：使用float 屬性水平排列撲克牌.......................................60 4.4.4 常見問題Q＆A ............................64 4.5 理論習題 ..........................................65 第5 課 復合選擇器與網(wǎng)頁導航菜單 68 5.1 什么是復合選擇器 ..........................69 5.1.1 復合選擇器的種類 ......................69 5.1.2 后代選擇器與子元素選擇器的 區(qū)別..............................................70 5.1.3 毗鄰兄弟選擇器與同級兄弟選擇 器的區(qū)別......................................70 5.1.4 結構化偽類選擇器與偽元素 詳解 ..............................................71 5.1.5 導航菜單超鏈接使用的選擇器 ..73 5.2 無序列表導航菜單 ..........................74 5.2.1 只改變字體顏色 ..........................74 5.2.2 鏈接項呈現(xiàn)塊級變化......... 77 5.3 常見的CSS1 ～ CSS3 選擇器 ........79 5.4 每課小練 ..........................................80 5.4.1 練一練：后代選擇器與橫向導航 菜單...............................................80 5.4.2 學以致用：復合選擇器與太陽系 網(wǎng)頁..............................................81 5.4.3 常見問題Q＆A ............................87 5.5 理論習題 ..........................................87 第6 課 基本HTML5 框架與應用 90 6.1 什么是語義化結構標簽 ..................91 6.2 語義化結構標簽的應用 ..................92 6.3 ＜meta＞ 標簽 .....................................93 6.3.1 ＜meta＞ 標簽的基本用途 ............93 6.3.2 控制響應式設計中的視口 ..........93 6.3.3 設置網(wǎng)頁的定時跳轉 ..................93 6.4 每課小練 ..........................................94 6.4.1 練一練：使用＜section＞ 標簽的上 下結構網(wǎng)頁框架 .........................94 6.4.2 學以致用：使用CSS 實現(xiàn)個人簡 歷網(wǎng)頁..........................................97 6.4.3 常見問題Q＆A ............................99 6.5 理論習題 ........................................100 第7 課 盒子模型與DOM 樹 102 7.1 DOM 樹與文件流 ..........................103 7.2 盒子模型 ........................................103 7.2.1 什么是盒子模型 ........................103 7.2.2 容器與元素關系 ........................104 7.2.3 塊級元素與行內元素 ................105 7.3 float 與clear 屬性 ..........................106 7.3.1 標準文件流 ................................106 7.3.2 使用float 屬性使元素脫離標 準流 ............................................106 7.3.3 使用clear 屬性清除浮動的 影響 ............................................107 7.4 每課小練 ........................................107 7.4.1 練一練：float 與clear 屬性的 應用 ............................................107 7.4.2 學以致用：制作IPanda 網(wǎng)頁...109 7.4.3 常見問題Q＆A .......................... 113 7.5 理論習題 ........................................ 113 第8 課 position 位置屬性 115 8.1 疊放層與漂浮層 ............................ 116 8.1.1 position 位置屬性 ...................... 116 8.1.2 z-index 屬性 ............................... 116 8.2 relative 與absolute 的精確定位 .... 117 8.3 每課小練 ........................................ 118 8.3.1 練一練：通過四角定位撲 克牌 ............................................ 118 8.3.2 試一試：使用position 位置屬性實 現(xiàn)疊放層的應用 .......................120 8.3.3 常見問題Q＆A ..........................121 8.4 理論習題 ........................................121 第9 課 CSS+DIV 固定寬度的頁面 布局 123 9.1 float 左右布局 ................................124 9.2 float 左中右布局 ............................125 9.3 position 彈性左中右布局 ..............126 9.4 固定寬度的混合布局 ....................128 9.5 網(wǎng)頁制作的“3O”原則 ...............129 9.6 每課小練 ........................................129 9.6.1 練一練：float 左右布局基本 框架 ............................................129 9.6.2 練一練：使用float 屬性與position 位置屬性進行固定寬度混合布局 ....................................................131 9.6.3 學以致用：簡化版杭州19 樓 網(wǎng)頁 ............................................132 9.6.4 常見問題Q＆A ..........................133 9.7 理論習題 ........................................134 第10 課 表單基礎 136 10.1 表單與表單對象 ..........................137 10.1.1 什么是表單............... 137 10.1.2 ＜form＞ 標簽 ............................137 10.1.3 表單對象 ..................................138 10.2 注冊登錄表單實例 ......................141 10.3 每課小練 ......................................142 10.3.1 練一練：制作簡單表單網(wǎng)頁 .142 10.3.2 學以致用：表單應用實例 ......143 10.3.3 常見問題Q＆A ........................144 10.4 理論習題 ......................................144 第11 課 JavaScript 基本應用 146 11.1 什么是JavaScript.........................147 11.2 JavaScript 的應用方法.................147 11.2.1 JavaScript 基本語法 ................147 11.2.2 最簡單的JavaScript 程序（Say Hello!） ...................................149 11.2.3 表單數(shù)據(jù)驗證 ..........................150 11.2.4 常用的JavaScript 對象與方法 151 11.2.5 定時器函數(shù) ..............................154 11.3 每課小練 ......................................154 11.3.1 練一練：簡單時鐘網(wǎng)頁實例 ..154 11.3.2 學以致用：制作考生登錄 表單 ..........................................157 11.3.3 試一試：JavaScript 漂浮層的應用 實例..........................................158 11.3.4 常見問題Q＆A ........................160 11.4 理論習題 ......................................160 第12 課 jQuery 特效 162 12.1 jQuery 簡介 ..................................163 12.1.1 什么是jQuery .........................163 12.1.2 jQuery 庫文件的下載與引用..164 12.2 jQuery 文件就緒事件 .................165 12.3 jQuery 選擇器及其操作 .............165 12.4 jQuery 常見特效 .........................166 12.4.1 最簡單的例子——點一點就 消失 ..........................................166 12.4.2 使用slideToggle() 方法控制面板 展開或收起..............................167 12.4.3 使用animate() 動畫實現(xiàn)頁面上下 滾動 .........................................168 12.5 每課小練 ......................................169 12.5.1 練一練：鼠標懸停切換圖像 特效 ...........................................170 12.5.2 學以致用：jQuery 輪播特效 實例 ..........................................172 12.5.3 常見問題Q＆A ........................177 12.6 理論習題 ......................................177 第13 課 固定寬度網(wǎng)頁實例 179 13.1 IHangzhou 網(wǎng)頁 ...........................180 13.2 杭州19 樓綜合頁面 ...................180 13.3 杭州亞運新聞網(wǎng)頁 ......................181 13.4 每課小練 ......................................183 13.4.1 練一練：頁面布局分析與 重現(xiàn) ..........................................183 13.4.2 學以致用：開發(fā)創(chuàng)意網(wǎng)站 ......183 13.4.3 常見問題Q＆A ........................184 13.5 理論習題 ......................................184 第14 課 響應式設計基礎 185 14.1 響應式網(wǎng)站概述 ..........................186 14.1.1 最簡單的響應式設計CSS 樣式 代碼 ..........................................186 14.1.2 視口 ..........................................186 14.1.3 響應式技術支持 ......................187 14.2 媒體查詢與斷點 .........................187 14.2.1 媒體查詢的語法規(guī)則 ..............187 14.2.2 斷點與多段響應式 ..................188 14.2.3 斷點取值 ..................................189 14.3 彈性布局 ......................................189 14.4 響應式左右布局 ..........................191 14.5 每課小練 ......................................192 14.5.1 練一練：兩段響應式布局 ......192 14.5.2 學以致用：制作響應式IPanda 網(wǎng)頁 ..........................................194 14.5.3 常見問題Q＆A ........................196 14.6 理論習題 ......................................196 第15 課 響應式設計特點及應用 198 15.1 響應式設計特點 .........................199 15.1.1 設計原則 ..................................199 15.1.2 響應式設計考慮要點 ..............199 15.1.3 彈性布局 ..................................200 15.2 多段響應式布局實例 ..................201 15.3 網(wǎng)頁中的圖像 ..............................204 15.3.1 彈性圖像 ..................................204 15.3.2 常見的網(wǎng)頁圖像文件類型 ......205 15.3.3 圖像拼合技術 ..........................207 15.3.4 字體圖標 ..................................207 15.4 網(wǎng)頁字體 ......................................208 15.4.1 襯線體與非襯線體 ..................208 15.4.2 使用@font-face 功能設置 字體 ..........................................208 15.5 每課小練 ......................................209 15.5.1 練一練：三段響應式布局 練習 ..........................................209 15.5.2 試一試：制作三段響應式Oscar 網(wǎng)頁..........................................210 15.6 理論習題 .....................................214 第16 課 Flexbox 伸縮盒 216 16.1 什么是Flexbox 伸縮盒 ...............217 16.2 常用的Flexbox 伸縮盒屬性 .......217 16.3 每課小練 ......................................219 16.3.1 練一練：Flexbox 伸縮盒網(wǎng)頁 練習 ..........................................219 16.3.2 試一試：將Flexbox 伸縮盒用于 響應式布局..............................220 16.3.3 常見問題Q＆A ........................223 16.4 理論習題 ......................................223 第17 課 網(wǎng)站建設概述 225 17.1 網(wǎng)站建設過程與規(guī)范 ..................226 17.2 什么是自建站 ..............................226 17.3 網(wǎng)站重構 ......................................226 17.4 網(wǎng)站建設項目需求 ......................227 17.5 網(wǎng)站文件管理 ..............................227 17.6 每課小練 ......................................228 17.6.1 學以致用：網(wǎng)站建設實踐 ......228 17.6.2 常見問題Q＆A ........................233 17.7 理論習題 ......................................234 第18 課 HTML5 的API 235 18.1 什么是API ...................................236 18.2 ＜canvas＞ 繪圖 ..............................236 18.2.1 什么是網(wǎng)頁Canvas 畫布 ........236 18.2.2 Canvas 繪圖實例 .....................237 18.3 音樂播放器 ..................................239 18.3.1 ＜audio＞ 標簽 ...........................239 18.3.2 音樂播放器代碼實現(xiàn) ..............240 18.4 百度地圖API 簡介 ......................246 18.5 理論習題 ......................................250 附錄 251
你還可能感興趣
我要評論
|
