HTML5與CSS3是網頁制作技術的核心,也是每位網頁制作者都需要掌握的基礎知識。本書從初學者的角度出發(fā),以形象的比喻、實用的案例、通俗易懂的語言詳細介紹如何使用HTML5與CSS3進行網頁設計與制作的相關知識和技巧。
全書共12章,第1~4章主要講解HTML5與CSS3的基礎知識,內容包括網頁設計概述、初識HTML5、初識CSS3、CSS3中其他類型的選擇器等;第5~8章主要講解網頁制作的一些重要技術,內容包括盒子模型、列表和超鏈接、表格和表單、DIV+CSS布局等;第9~11章主要講解HTML5和CSS3的新特性,內容包括多媒體嵌入、過渡、變形、動畫、繪圖和數據存儲;第12章為實戰(zhàn)開發(fā)項目——制作企業(yè)網站頁面,本章將結合前面所學知識,帶領讀者開發(fā)一個中型網站頁面,進一步培養(yǎng)讀者網頁制作和開發(fā)的能力。
本書配套豐富的教學資源,包括教學PPT、教學大綱、源代碼、課后習題及答案等。為幫助讀者更好地學習本書中的內容,編者團隊還提供了在線答疑服務,希望能夠幫助到更多讀者。
1.黑馬程序員-Web前端開發(fā)系列叢書
2.本書配套豐富的教學資源,包括教學PPT、教學大綱、教案、源代碼、教學視頻、課后習題及答案。
3.新版教材做了升級、優(yōu)化,更加符合最新的教學需求。
黑馬程序員是傳智教育旗下高端IT教育品牌,傳智教育是國內首個實現(xiàn)A股IPO的教育企業(yè)。依托于傳智雄厚的教育資源,秉承傳智教育“為中華民族偉大復興而講課,為千萬學生少走彎路而著書”的使命,致力于培養(yǎng)高精尖數字化人才,為國家建設現(xiàn)代化經濟體系的戰(zhàn)略目標培養(yǎng)科技人才。
黑馬程序員課程涵蓋了JavaEE、鴻蒙應用開發(fā)、HTML&JS+前端、Python大數據開發(fā)、人工智能、電商視覺設計、軟件測試、新媒體、產品經理等熱門精品學科。已在北京昌平、北京順義、上海、廣州、深圳、武漢、鄭州、西安、長沙、濟南、重慶、南京、杭州、石家莊、成都、合肥、太原16個城市設立17所分校。
第 1章 HTML5+CSS3網頁設計
概述1
1.1 網頁概述1
1.1.1 認識網頁1
1.1.2 網頁名詞解釋3
1.1.3 Web標準4
1.2 網頁制作入門6
1.2.1 HTML6
1.2.2 CSS7
1.2.3 JavaScript8
1.2.4 網頁的展示平臺—瀏覽器9
1.3 網頁代碼編輯工具12
1.3.1 Visual Studio Code的安裝和
設置12
1.3.2 Visual Studio Code的使用15
1.4 階段案例—創(chuàng)建第 一個網頁17
1.5 本章小結17
1.6 課后練習18
第 2章 初識HTML519
2.1 HTML5的優(yōu)勢19
2.2 HTML5的基本結構20
2.3 標簽概述21
2.3.1 標簽的分類22
2.3.2 標簽間的關系23
2.3.3 標簽的屬性23
2.3.4 HTML5頭部相關標簽24
2.4 文本控制標簽25
2.4.1 頁面格式化標簽25
2.4.2 文本格式化標簽28
2.4.3 HTML實體29
2.5 圖像標簽30
2.5.1 常見圖像格式30
2.5.2 插入圖像31
2.6 階段案例—制作新聞頁面37
2.7 本章小結37
2.8 課后練習37
第3章 初識CSS338
3.1 結構與表現(xiàn)分離38
3.2 CSS3的優(yōu)勢39
3.3 CSS核心基礎40
3.3.1 CSS樣式規(guī)則40
3.3.2 引入CSS樣式41
3.3.3 CSS基礎選擇器45
3.4 設置文本樣式47
3.4.1 字體樣式屬性47
3.4.2 文本外觀屬性51
3.5 CSS核心進階60
3.5.1 CSS復合選擇器60
3.5.2 CSS層疊性和繼承性63
3.5.3 CSS優(yōu)先級65
3.6 階段案例—制作活動通知頁面68
3.7 本章小結68
3.8 課后練習68
第4章 CSS3中其他類型的選擇器69
4.1 屬性選擇器69
4.1.1 E[attribute^=value]選擇器69
4.1.2 E[attribute$=value]選擇器70
4.1.3 E[attribute*=value]選擇器71
4.2 關系選擇器72
4.2.1 子代關系選擇器72
4.2.2 兄弟關系選擇器73
4.3 結構化偽類選擇器75
4.3.1 :root選擇器75
4.3.2 :not選擇器76
4.3.3 :only-child選擇器77
4.3.4 :first-child選擇器和:last-child
選擇器78
4.3.5 :nth-child(n)選擇器和:nth-
last-child(n)選擇器79
4.3.6 :first-of-type選擇器和
:last-of-type選擇器80
4.3.7 :nth-of-type(n)選擇器和:nth-
last-of-type(n)選擇器81
4.3.8 :empty選擇器83
4.4 偽元素選擇器84
4.4.1 ::before選擇器84
4.4.2 ::after選擇器85
4.5 階段案例—制作列車時刻表87
4.6 本章小結87
4.7 課后練習87
第5章 盒子模型88
5.1 認識盒子模型88
5.2 盒子模型的相關屬性90
5.2.1 邊框屬性90
5.2.2 內邊距屬性96
5.2.3 外邊距屬性98
5.2.4 背景屬性99
5.2.5 寬度屬性與高度屬性104
5.3 CSS3新增盒子模型屬性105
5.3.1 透明度105
5.3.2 圓角邊框106
5.3.3 圖像邊框109
5.3.4 陰影111
5.3.5 漸變113
5.3.6 多背景圖像118
5.3.7 調整背景圖像的屬性119
5.4 元素的類型和轉換120
5.4.1 元素的類型120
5.4.2 標簽和標簽121
5.4.3 元素類型的轉換124
5.5 塊元素垂直外邊距的合并126
5.5.1 相鄰塊元素垂直外邊距的合并126
5.5.2 嵌套塊元素垂直外邊距的合并127
5.6 階段案例—制作音樂排行榜128
5.7 本章小結129
5.8 課后練習129
第6章 列表和超鏈接130
6.1 列表標簽130
6.1.1 無序列表130
6.1.2 有序列表131
6.1.3 定義列表133
6.1.4 列表的嵌套134
6.2 CSS列表樣式屬性135
6.2.1 list-style-type屬性135
6.2.2 list-style-image屬性137
6.2.3 list-style-position屬性137
6.2.4 list-style屬性139
6.3 超鏈接標簽140
6.3.1 創(chuàng)建超鏈接141
6.3.2 錨點鏈接142
6.4 用鏈接偽類控制超鏈接144
6.5 階段案例—制作新聞列表146
6.6 本章小結146
6.7 課后練習146
第7章 表格和表單147
7.1 表格147
7.1.1 創(chuàng)建表格147
7.1.2 表格標簽的屬性149
7.1.3 用CSS控制表格樣式152
7.2 表單157
7.2.1 表單的構成157
7.2.2 創(chuàng)建表單158
7.3 表單控件159
7.3.1 標簽159
7.3.2