《HTML5+CSS3網頁布局任務教程》是2020年中國鐵道出版社出版的圖書。
基本介紹
- 中文名：HTML5+CSS3網頁布局任務教程
- 作者：編者:斯琴高娃|責編:陸慧萍
- 類別：工學教材
- 出版社：中國鐵道出版社
- 出版時間：2020年
- 開本：16 開
- 裝幀：平裝-膠訂
- ISBN：9787113271800
內容簡介,圖書目錄,作者簡介,
內容簡介
本書根據HTML5和CSS3標準詳細講解了網頁的布局和製作方法。全書共分12個單元，內容包括：準備工作、HTML5 常見元素、網頁整體布局的搭建、網頁主體內容的構建、網頁頁眉的構建、網頁主導航的構建、網頁橫幅廣告的構建、網頁頁腳的構建，以及混合布局的綜合網頁的構建。每個單元包含若干個任務，各任務之間有連貫性，強化和覆蓋相關知識點。本書與Web前端開發工作崗位接軌，強調三方面的技能：一是針對只會寫局部不會寫整體的問題，培養基於網頁設計稿（或效果圖）來規劃網頁，從網頁整體入手，先搭建結構，再填充內容的技能；二是歸納和強化常用的方法，使讀者熟練掌握方法，而不僅是知識點；三是學會寫代碼，而不是用Dreamweaver的可視化操作來生成代碼。本書適合作為高職高專院校HTML5 CSS3 集中實訓課程或理實一體化課程的教材，也可作為網頁設計與製作愛好者的自學讀物
圖書目錄
第1 單元 準備工作.......................................................................................... 1
任務1.1 認識HTML5 和CSS3 ................................................................................................ 1
任務1.2 搭建軟體環境........................................................................................................... 2
任務1.2.1 安裝HBuilder X ............................................................................................. 3
任務1.2.2 安裝Sublime Text3 ........................................................................................ 5
任務1.3 分析個網頁........................................................................................................ 6
任務1.4 了解網頁編輯和調試技巧........................................................................................ 9
單元小結............................................................................................................................... .. 10
習題............................................................................................................................... .......... 10
第2 單元 HTML5 常見元素............................................................................ 12
任務2.1 認識標題元素......................................................................................................... 12
任務2.2 認識段落元素......................................................................................................... 14
任務2.3 認識換行元素、水平線元素.................................................................................. 15
任務2.4 認識圖像元素......................................................................................................... 16
任務2.5 認識超連結............................................................................................................. 17
任務2.6 認識無序列表......................................................................................................... 18
任務2.7 認識有序列表......................................................................................................... 19
任務2.8 認識自定義列表...................................................................................................... 20
任務2.9 認識表格元素......................................................................................................... 21
任務2.10 認識表單元素....................................................................................................... 23
任務2.11 認識音頻、視頻元素............................................................................................ 24
單元小結............................................................................................................................... .. 26
習題............................................................................................................................... .......... 26
第3 單元 網頁整體布局的搭建...................................................................... 27
任務3.1 單列布局的搭建...................................................................................................... 27
任務3.1.1 網頁結構的實現........................................................................................... 28
任務3.1.2 網頁樣式的實現........................................................................................... 29
任務3.2 左寬右窄兩列布局（F 式布局）的搭建................................................................ 35
任務3.2.1 網頁結構的實現........................................................................................... 35
任務3.2.2 網頁樣式的實現........................................................................................... 36
任務3.3 三列布局的搭建...................................................................................................... 44
目 錄
2 HTML5 CSS3 網頁布局任務教程
任務3.3.1 網頁結構的實現........................................................................................... 44
任務3.3.2 網頁樣式的實現........................................................................................... 45
單元小結............................................................................................................................... .. 51
習題............................................................................................................................... .......... 51
第4 單元 網頁主體內容的構建1——文本的製作........................................... 53
任務4.1 “海南島簡介”頁的製作（標題 段落）................................................................ 53
任務4.1.1 網頁結構的實現........................................................................................... 54
任務4.1.2 網頁基本樣式的實現................................................................................... 56
任務4.1.3 簡介標題樣式和段落樣式的實現................................................................. 58
任務4.2 “學院簡介”頁的製作（頭部 段落） ................................................................... 63
任務4.2.1 網頁結構的實現........................................................................................... 64
任務4.2.2 網頁基本樣式的實現................................................................................... 65
任務4.2.3 簡介頭部的樣式和正文樣式的實現............................................................. 66
任務4.3 “美麗的草原”頁的製作（頭部 章節）................................................................ 69
任務4.3.1 網頁結構和基本樣式的實現........................................................................ 70
任務4.3.2 文章頭部樣式和章節樣式的實現................................................................. 72
任務4.4 “學院首頁”兩行對稱欄目的製作......................................................................... 73
任務4.4.1 網頁結構和基本樣式的實現........................................................................ 74
任務4.4.2 兩列對稱欄目樣式的實現............................................................................ 78
任務4.5 “學院首頁”三列非對稱欄目的製作...................................................................... 81
任務4.5.1 網頁結構和基本樣式的實現........................................................................ 82
任務4.5.2 三列非對稱欄目樣式的實現........................................................................ 85
任務4.6 “專業介紹”頁的製作（左窄右寬的兩列布局）................................................... 88
任務4.6.1 網頁結構和基本樣式的實現........................................................................ 89
任務4.6.2 左窄右寬的兩列布局的實現........................................................................ 91
單元小結............................................................................................................................... .. 96
習題............................................................................................................................... .......... 96
第5 單元 網頁主體內容的構建2——圖片的製作........................................... 98
任務5.1 “學院首頁”兩行對稱欄目插圖............................................................................. 98
任務5.2 “學院首頁”三列非對稱欄目插圖....................................................................... 101
任務5.3 F 式布局、左圖右文............................................................................................. 106
任務5.4 兩列布局、上圖下文............................................................................................ 109
任務5.5 文字環繞圖片1 ...................................................................
作者簡介
斯琴高娃，海南職業技術學院
