Web前端技術項目實戰教程（簡體書）

本書站在初學者的角度，以常用、實用、易懂為原則講述Web知識，通過情境置入、案例分析，詳細介紹了HTML、CSS及響應式佈局等方面的知識和技巧。全書以項目為導向，通過8個項目將知識點串聯起來，每個項目均會安排製作一個完整的網頁頁面，這樣學生能快速上手，增強學習效果。8個項目分別為走進Web的世界、“個人簡介”專題頁製作、“旅遊網”專題頁製作、“寵物相冊”專題頁製作、“潮流前線”專題頁製作、“商貿網信息註冊”專題頁製作、“大學生服務中心”專題頁製作、“菜鳥充電站”響應式頁面設計。
本書配有以下資源：書中所有案例的素材、效果文件、源代碼、習題、課件等，以利於教師授課，學生練習。
本書既可作為普通高等院校相關專業的網頁設計與製作課程的教材，也可作為網頁平面設計的培訓教材，還可作為網頁製作、美工設計、網站開發、網頁編程等行業人員的參考用書。
本書配有免費電子課件，歡迎選用本書作教材的教師登錄www.cmpedu.com註冊下載，或發郵件至jinacmp@163.com索取。

前言


項目1走進Web的世界1

【項目背景】1

【任務1.1】瞭解Web基本概念1

【任務1.2】掌握前端開發工具:代碼

編輯器(HBuilder)4

【任務1.3】圖像處理工具

(Photoshop)6

【項目總結】7

【課後練習】7

項目2“個人簡介”專題頁製作8

【項目背景】8

【任務2.1】學習HTML基本概念9

【任務2.2】學習HTML文本控制

標簽12

【任務2.3】學習HTML圖像標簽22

【任務2.4】設計“個人簡介”頁面

佈局24

【任務2.5】個人簡介頭部模塊製作26

【任務2.6】個人簡介模塊製作27

【任務2.7】個人簡介頁腳模塊製作 29

【項目總結】29

【課後練習】30

項目3“旅遊網”專題頁製作31

【項目背景】31

【任務3.1】學習CSS基本用法32

【任務3.2】學習CSS控制文本樣式36

【任務3.3】學習CSS高級特性 42

【任務3.4】設計“旅遊網”佈局54

【任務3.5】導航模塊製作57

【任務3.6】導語模塊製作58

【任務3.7】內容模塊製作59

【任務3.8】頁腳模塊製作63

【項目總結】64

【課後練習】 65

項目4“寵物相冊”專題頁製作66

【項目背景】 66

【任務4.1】盒子模型的結構67

【任務4.2】盒子模型的相關屬性69

【任務4.3】塊級元素與行內元素之間的

轉換93

【任務4.4】“寵物相冊”頁面佈局98

【任務4.5】導航模塊製作100

【任務4.6】相冊模塊製作104

【任務4.7】頁腳模塊製作108

【項目總結】109

【課後練習】110

項目5“潮流前線”專題頁製作112

【項目背景】112

【任務5.1】掌握列表標簽112

【任務5.2】掌握浮動定位115

【任務5.3】掌握相對定位120

【任務5.4】掌握絕對定位122

【任務5.5】掌握固定定位127

【任務5.6】“潮流前線”頁面設計128

【項目總結】139

【課後練習】 139

項目6“商貿網信息註冊”專題頁

製作140

【項目背景】140

【任務6.1】表格標簽141

【任務6.2】表單標簽156

【任務6.3】表單控件158

【任務6.4】“商貿網信息註冊”頁面

佈局及基礎樣式定義167

【任務6.5】標題搜索模塊製作170

【任務6.6】菜單模塊製作173

【任務6.7】banner模塊製作175

【任務6.8】註冊信息模塊製作176

【任務6.9】頁腳模塊製作181

【項目總結】 182

【課後練習】 182

項目7“大學生服務中心”專題頁

製作185






【項目背景】185

【任務7.1】 網頁佈局的基本概念186

【任務7.2】分列佈局186

【任務7.3】DIV+CSS佈局實現

方式195

【任務7.4】“大學生服務中心”專題頁

各部分的製作197

【項目總結】208

【課後練習】208

項目8“菜鳥充電站”響應式頁面

設計209

【項目背景】209

【任務8.1】瞭解響應式頁面設計209

【任務8.2】瞭解常用的RWD技術210

【任務8.3】使用媒體查詢和彈性佈局

實現“菜鳥充電站”

設計226

【項目總結】 232

【課後練習】 232

參考文獻234