Web前端技術(shù)(HTML5+CSS3+響應(yīng)式設(shè)計(jì))
定 價(jià):34.8 元
叢書名:普通高等教育計(jì)算機(jī)類系列教材
- 作者:李舒亮主編
- 出版時(shí)間:2020/3/1
- ISBN:9787111645948
- 出 版 社:機(jī)械工業(yè)出版社
- 中圖法分類:TP312.8
- 頁(yè)碼:229
- 紙張:膠版紙
- 版次:1
- 開本:16K
全書分為5部分共12章。第1部分是Web基礎(chǔ)和HTML語(yǔ)法,包括第1、2章的內(nèi)容;第2部分是CSS核心原理,主要講解CSS選擇器、盒子模型、浮動(dòng)、定位、CSS特性等,包括第3~6章的內(nèi)容;第3部分是CSS專題技術(shù),主要講解各種導(dǎo)航的制作、網(wǎng)頁(yè)布局的實(shí)現(xiàn)、表單的制作與美化、CSS3的新增屬性等,包括第7~10章的內(nèi)容;第4部分是響應(yīng)式Web設(shè)計(jì)原理,主要講解視口、媒體查詢、百分比布局、彈性盒布局等,包括第11章的內(nèi)容;第5部分即第12章,是綜合應(yīng)用,以案例的形式,利用前面4部分的知識(shí)講解網(wǎng)站從設(shè)計(jì)到實(shí)現(xiàn)的全過(guò)程。
隨著互聯(lián)網(wǎng)的迅猛發(fā)展,各種互聯(lián)網(wǎng)項(xiàng)目不斷興起,對(duì)用戶體驗(yàn)提出了更高的要求,前端開發(fā)也逐漸成為重要的研發(fā)角色。Web前端的三大核心技術(shù)為HTML、CSS、JavaScript。由于篇幅原因,本書主要講解HTML、CSS和現(xiàn)在流行的響應(yīng)式設(shè)計(jì)技術(shù)。
本書全面詳細(xì)講解了Web前端中的實(shí)用技術(shù),以Web開發(fā)實(shí)際應(yīng)用為驅(qū)動(dòng),循序漸進(jìn)、案例豐富。全書分為5部分共12章。
第1部分是Web基礎(chǔ)和HTML語(yǔ)法,包括第1、2章的內(nèi)容,主要介紹了Web中常用的術(shù)語(yǔ)和主要的HTML標(biāo)簽。通過(guò)第1部分的學(xué)習(xí),讀者可以制作出簡(jiǎn)單的網(wǎng)頁(yè)。
第2部分是CSS核心原理,包括第3~6章的內(nèi)容,主要講解CSS的各類選擇器、盒子模型、浮動(dòng)、定位、CSS特性等。通過(guò)第2部分的學(xué)習(xí),讀者可以對(duì)網(wǎng)頁(yè)進(jìn)行各種修飾、美化。
第3部分是CSS專題技術(shù),包括第7~10章的內(nèi)容,主要講解各種導(dǎo)航的制作、網(wǎng)頁(yè)布局的實(shí)現(xiàn)、表單的制作與美化、CSS3的新增屬性等。通過(guò)第3部分的學(xué)習(xí),讀者可以制作出整齊、美觀的帶交互網(wǎng)頁(yè)。
第4部分是響應(yīng)式Web設(shè)計(jì)原理,包括第11章的內(nèi)容,主要講解視口、媒體查詢、百分比布局、彈性盒布局等。通過(guò)第4部分的學(xué)習(xí),讀者可以制作出能適應(yīng)各類終端設(shè)備的網(wǎng)頁(yè)。
第5部分即第12章,是綜合應(yīng)用,以案例的形式,利用前面4部分的知識(shí)講解網(wǎng)站從設(shè)計(jì)到實(shí)現(xiàn)的全過(guò)程。
本書精選例題數(shù)十個(gè),所有例題均在谷歌瀏覽器和IE11.0瀏覽器中測(cè)試通過(guò)。因?yàn)闉g覽器對(duì)CSS3屬性的支持性不同,因此建議讀者安裝新版的谷歌瀏覽器,或把IE瀏覽器升級(jí)為11.0版本。
本書資料豐富,包括配套教學(xué)PPT、源代碼、作業(yè)、測(cè)驗(yàn)等。在學(xué)銀在線有對(duì)應(yīng)的慕課教程,網(wǎng)址為http://mooc1.chaoxing.com/course/template60/100578395.html,課程名稱為Web前端技術(shù)(HTML5+CSS3)。
本書第1、2章由劉細(xì)珠編寫,第3~6章由周西柳編寫,第7~12章由李舒亮編寫,各章動(dòng)手實(shí)踐和思考題由陳鵬海編寫。
愿本書對(duì)讀者學(xué)習(xí)Web前端技術(shù)有所幫助,書中難免有不足之處,真誠(chéng)地歡迎讀者批評(píng)指正,相互交流,共同學(xué)習(xí)進(jìn)步。
編者
前 言
第1章 Web前端技術(shù)概述
1.1 Web前端開發(fā)技術(shù)的發(fā)展
1.1.1 Web 1.0時(shí)代的網(wǎng)頁(yè)制作
1.1.2 Web 2.0時(shí)代的前端開發(fā)
1.1.3 前端開發(fā)的核心技術(shù)
1.2 Web術(shù)語(yǔ)
1.3 Web標(biāo)準(zhǔn)
1.3.1 什么是Web標(biāo)準(zhǔn)
1.3.2 Web標(biāo)準(zhǔn)的優(yōu)勢(shì)
1.4 瀏覽器的種類與作用
1.4.1 瀏覽器的種類
1.4.2 瀏覽器的市場(chǎng)份額
1.5 前端開發(fā)工具
本章小結(jié)
第2章 HTML5語(yǔ)法基礎(chǔ)
2.1 HTML概述
2.1.1 HTML簡(jiǎn)介
2.1.2 標(biāo)簽
2.1.3 標(biāo)簽的屬性
2.1.4 注釋語(yǔ)句
2.1.5 HTML文檔的結(jié)構(gòu)
2.2 頭部標(biāo)簽
2.2.1
2.2.2
2.2.3
2.3 文本類標(biāo)簽
2.3.1 主體標(biāo)簽
2.3.2 文章標(biāo)題標(biāo)簽
2.3.3 段落標(biāo)簽
2.3.4 換行標(biāo)簽
2.3.5 文本加粗標(biāo)簽
2.3.6 文本傾斜標(biāo)簽
2.3.7 預(yù)格式化標(biāo)簽
2.3.8 定義水平線標(biāo)簽
2.4 列表標(biāo)簽
2.4.1 無(wú)序列表
2.4.2 有序列表
2.4.3 自定義列表
2.5 表格標(biāo)簽
2.6 多媒體類標(biāo)簽
2.6.1 圖像標(biāo)簽
2.6.2 視頻標(biāo)簽
2.6.3 音頻標(biāo)簽
2.7 絕對(duì)路徑和相對(duì)路徑
2.7.1 絕對(duì)路徑
2.7.2 相對(duì)路徑
2.8 鏈接標(biāo)簽
2.8.1 創(chuàng)建鏈接
2.8.2 鏈接的分類
2.9 其他標(biāo)簽
2.9.1 典型的塊元素和行元素
2.9.2 HTML實(shí)體
本章小結(jié)
第3章 CSS樣式基礎(chǔ)
3.1 CSS概述
3.2 CSS語(yǔ)法規(guī)則
3.3 CSS基本選擇器
3.3.1 標(biāo)簽選擇器
3.3.2 類別選擇器
3.3.3 ID選擇器
3.3.4 選擇器分組
3.4 CSS樣式的引用
3.4.1 內(nèi)聯(lián)樣式
3.4.2 內(nèi)部樣式表
3.4.3 外部樣式表
3.4.4 導(dǎo)入樣式表
3.5 CSS文本樣式
3.5.1 CSS字體
3.5.2 CSS文本
本章小結(jié)
第4章 CSS復(fù)合選擇器及特性
4.1 CSS組合選擇器
4.1.1 標(biāo)記類別選擇器
4.1.2 后代選擇器
4.1.3 子元素選擇器
4.1.4 兄弟選擇器
4.2 CSS其他選擇器
4.2.1 屬性選擇器
4.2.2 CSS偽類
4.2.3 CSS偽元素
4.3 CSS的特性
4.3.1 CSS的繼承性
4.3.2 CSS的層疊性
4.3.3 CSS的優(yōu)先級(jí)
本章小結(jié)
第5章 CSS盒子模型
5.1 CSS盒子模型的概念
5.2 CSS盒子模型的設(shè)置
5.2.1 元素的寬度和高度
5.2.2 盒子的邊框
5.2.3 盒子的內(nèi)邊距
5.2.4 盒子的外邊距
5.2.5 盒子的寬與高
5.3 盒子的背景設(shè)置
5.3.1 背景色
5.3.2 背景圖像
5.3.3 其他背景屬性
5.4 標(biāo)準(zhǔn)文檔流
5.4.1 元素的分類
5.4.2 元素的位置關(guān)系
5.4.3 display屬性
本章小結(jié)
第6章 浮動(dòng)與定位
6.1 浮動(dòng)
6.1.1 浮動(dòng)簡(jiǎn)介
6.1.2 清除浮動(dòng)
6.2 定位
6.2.1 定位的概念
6.2.2 靜態(tài)定位
6.2.3 相對(duì)定位
6.2.4 絕對(duì)定位
6.2.5 固定定位
6.2.6 zindex層疊
本章小結(jié)
第7章 導(dǎo)航的制作
7.1 列表標(biāo)簽的CSS屬性
7.2 垂直導(dǎo)航條的制作
7.3 水平導(dǎo)航條的制作
7.4 二級(jí)導(dǎo)航條的制作
本章小結(jié)
第8章 網(wǎng)頁(yè)布局
8.1 常見布局
8.1.1 網(wǎng)頁(yè)布局原理
8.1.2 常見的布局形式
8.2 頁(yè)面布局標(biāo)簽
8.3 各種布局的實(shí)現(xiàn)
8.3.1 單列布局的實(shí)現(xiàn)
8.3.2 兩列布局的實(shí)現(xiàn)
8.3.3 三列布局的實(shí)現(xiàn)
8.3.4 混合布局的實(shí)現(xiàn)
8.4 布局案例
8.4.1 搭建HTML文檔結(jié)構(gòu)
8.4.2 添加主要的類名
8.4.3 公共樣式的設(shè)置
8.4.4 頁(yè)眉樣式的設(shè)置
8.4.5 主體樣式的設(shè)置
本章小結(jié)
第9章 表單的制作與美化
9.1 認(rèn)識(shí)表單
9.1.1 表單的構(gòu)成
9.1.2 創(chuàng)建表單
9.2 input控件及屬性
9.2.1 type屬性
9.2.2 其他屬性
9.3 其他表單控件
9.3.1 label標(biāo)記控件
9.3.2 select控件
9.3.3 textarea控件
9.4 美化表單
本章小結(jié)
第10章 CSS3的常用屬性
10.1 分列布局column屬性
10.2 文字陰影textshadow屬性
10.3 盒子boxshadow屬性
10.4 圓角邊框borderradius屬性
10.5 過(guò)渡transition屬性
10.6 變形transform屬性
10.7 動(dòng)畫animation屬性
10.8 CSS3照片墻的制作
本章小結(jié)
第11章 響應(yīng)式Web設(shè)計(jì)原理
11.1 視口概述
11.1.1 響應(yīng)式設(shè)計(jì)的網(wǎng)站
11.1.2 什么是視口
11.1.3 視口的設(shè)置
11.2 媒體查詢
11.2.1 什么是媒體查詢
11.2.2 媒體查詢的使用
11.2.3 漢堡菜單
11.3 百分比布局
11.3.1 圖像自適應(yīng)
11.3.2 文字自適應(yīng)
11.3.3 布局百分比
11.4 彈性盒布局
11.4.1 如何定義彈性盒模型
11.4.2 彈性盒模型中的容器屬性
11.4.3 彈性盒模型中子元素的屬性
11.5 響應(yīng)式設(shè)計(jì)案例
11.5.1 案例分析
11.5.2 分析HTML文檔結(jié)構(gòu)
11.5.3 編寫CSS樣式文件
本章小結(jié)
第12章 綜合案例
12.1 網(wǎng)站的開發(fā)流程
12.2 Web前端設(shè)計(jì)
12.2.1 Web前端設(shè)計(jì)的流程
12.2.2 內(nèi)容分析
12.2.3 結(jié)構(gòu)設(shè)計(jì)
12.2.4 原型設(shè)計(jì)
12.2.5 布局設(shè)計(jì)
12.2.6 公共樣式文件
12.2.7 詳細(xì)設(shè)計(jì)
本章小結(jié)
參考文獻(xiàn)