Web前端開發(fā)技術(shù)：HTML、CSS、JavaScript

第1章 Web前端開發(fā)技術(shù)綜述
1.1 Web概述
1.1.1 Web的起源
1.1.2 Web的特點(diǎn)
1.1.3 Web工作原理
1.2 Web前端開發(fā)工程師職業(yè)需求
1.2.1 Web前端開發(fā)的由來
1.2.2 Web前端開發(fā)工程師的職業(yè)要求
1.3 Web前端開發(fā)技術(shù)
1.3.1 HTML
1.3.2 CSS
1.3.3 JavaScript
1.3.4 HTML DOM
1.3.5 BOM
1.3.6 AJAX
1.4 Web前端開發(fā)工具
1.4.1 NotePad
1.4.2 EditPlus
1.4.3 TextPad
1.4.4 Dreamweaver
1.4.5 TopStyle
1.4.6 CSS3 Menu
1.4.7 Sothink Tree Menu
1.4.8 ColorImpact
1.5 瀏覽器工具
1.5.1 Internet Explorer
1.5.2 Mozilla Firefox
1.5.3 Google Chrome
1.5.4 Oprea
1.5.5 手機(jī)瀏覽器
1.6 綜合案例
本章小結(jié)
練習(xí)與實(shí)驗(yàn)
練習(xí)1
實(shí)驗(yàn)1
第2章 HTML基礎(chǔ)
2.1 HTML文檔結(jié)構(gòu)
2.2 頭部head
2.2.1 標(biāo)題title標(biāo)記
2.2.2 元信息meta標(biāo)記
2.2.3 樣式style標(biāo)記
2.3 主體body
2.3.1 body標(biāo)記
2.3.2 body標(biāo)記屬性
2.4 HTML基本語(yǔ)法
2.4.1 標(biāo)記語(yǔ)法
2.4.2 屬性語(yǔ)法
2.5 注釋
2.6 HTML文檔編寫規(guī)范
2.6.1 HTML頁(yè)面編碼基本規(guī)范
2.6.2 HTML文件命名規(guī)則
2.7 HTML文檔類型
2.7.1 標(biāo)記
2.7.2 DTD類型
2.8 綜合實(shí)例
2.8.1 使用NotePad編寫
2.8.2 使用EditPlus編寫
本章小結(jié)
練習(xí)與實(shí)驗(yàn)
練習(xí)2
實(shí)驗(yàn)2
第3章 格式化文字與段落
3.1 Web頁(yè)面初步設(shè)計(jì)
3.1.1 在body標(biāo)記中添加文字信息
3.1.2 標(biāo)題字標(biāo)記
3.1.3 添加空格與特殊符號(hào)
3.2 文本標(biāo)記
3.2.1 物理樣式標(biāo)記
3.2.2 邏輯樣式標(biāo)記
3.2.3 字體font標(biāo)記
3.3 段落
3.3.1 段落p標(biāo)記
3.3.2 換行br標(biāo)記
3.3.3 水平分隔線hr標(biāo)記
3.3.4 內(nèi)容居中center標(biāo)記
3.3.5 段落縮進(jìn)blockquote標(biāo)記
3.3.6 預(yù)格式化pre標(biāo)記
3.4 綜合實(shí)例
本章小結(jié)
練習(xí)與實(shí)驗(yàn)
練習(xí)3
實(shí)驗(yàn)3
第4章 列表
4.1 列表簡(jiǎn)介
4.2 無序列表
4.3 菜單列表和目錄列表
4.3.1 菜單列表menu標(biāo)記
4.3.2 目錄列表dir標(biāo)記
4.4 有序列表
4.5 嵌套列表
4.6 定義列表
4.7 綜合實(shí)例
本章小結(jié)
練習(xí)與實(shí)驗(yàn)
練習(xí)4
實(shí)驗(yàn)4
第5章 超鏈接
5.1 超鏈接簡(jiǎn)介
5.2 創(chuàng)建超鏈接
5.2.1 超鏈接語(yǔ)法
5.2.2 超鏈接路徑
5.2.3 超鏈接分類
5.3 鏈接對(duì)象
5.3.1 下載文件鏈接
5.3.2 書簽鏈接
5.3.3 FTP鏈接
5.3.4 圖像鏈接
5.3.5 電子郵件鏈接
5.4 綜合實(shí)例
本章小結(jié)
練習(xí)與實(shí)驗(yàn)
練習(xí)5
實(shí)驗(yàn)5
第6章 圖像與多媒體文件
6.1 圖像
6.1.1 插入圖像
6.1.2 設(shè)置圖像的提示文字
6.1.3 設(shè)置圖像的高度和寬度
6.1.4 設(shè)置圖像的邊框
6.1.5 設(shè)置圖像對(duì)齊方式
6.1.6 設(shè)置圖像的間距
6.1.7 設(shè)置圖像鏈接
6.2 滾動(dòng)文字
6.2.1 添加滾動(dòng)文字
6.2.2 設(shè)置滾動(dòng)文字背景顏色
6.2.3 設(shè)置滾動(dòng)方向
6.2.4 設(shè)置滾動(dòng)方式
6.2.5 設(shè)置滾動(dòng)速度
6.2.6 設(shè)置滾動(dòng)延遲
6.2.7 設(shè)置滾動(dòng)范圍
6.2.8 設(shè)置滾動(dòng)空白空間
6.2.9 設(shè)置滾動(dòng)循環(huán)
6.3 背景音樂與其他多媒體文件
6.3.1 添加背景音樂
6.3.2 插入音頻和視頻
6.3.3 插入flash動(dòng)畫
6.4 綜合實(shí)例
本章小結(jié)
練習(xí)與實(shí)驗(yàn)
練習(xí)6
實(shí)驗(yàn)6
第7章 CSS+DIV基礎(chǔ)
7.1 CSS概念
7.1.1 CSS的基本概念
7.1.2 傳統(tǒng)HTML的缺點(diǎn)
7.1.3 CSS的特點(diǎn)
7.1.4 CSS的優(yōu)勢(shì)
7.1.5 CSS編輯方法
7.1.6 瀏覽器與CSS
7.2 使用CSS控制Web頁(yè)面
7.2.1 CSS的基本語(yǔ)法
7.2.2 CSS選擇器類型
7.2.3 CSS選擇器聲明
7.2.4 CSS定義與引用
7.3 CSS繼承與層疊
7.4 DIV圖層
7.4.1 DIV創(chuàng)建
7.4.2 DIV使用
7.5 嵌套圖層
7.5.1 多DIV使用
7.5.2 DIV層疊
7.6 div標(biāo)記與span標(biāo)記
7.7 綜合案例
本章小結(jié)
練習(xí)與實(shí)驗(yàn)
練習(xí)7
實(shí)驗(yàn)7
第8章 CSS+DIV高級(jí)應(yīng)用
8.1 CSS屬性值中的單位
8.1.1 絕對(duì)單位
8.1.2 相對(duì)單位
8.2 CSS文字樣式
8.2.1 字體大小font size屬性
8.2.2 字體樣式font style屬性
8.2.3 字體變體font variant屬性
8.2.4 字體粗細(xì)font weight屬性
8.2.5 字體系列font family屬性
8.2.6 字體font屬性
8.3 CSS精細(xì)排版樣式
8.3.1 字符間距l(xiāng)etter spacing屬性
8.3.2 首行縮進(jìn)text indent屬性
8.3.3 字符裝飾text decoration 屬性
8.3.4 英文大小寫轉(zhuǎn)換text transform屬性
8.3.5 水平對(duì)齊text align屬性
8.3.6 垂直對(duì)齊vertical align屬性
8.3.7 行距l(xiāng)ine height屬性
8.4 CSS背景與顏色
8.4.1 顏色color屬性
8.4.2 背景background屬性
8.5 CSS列表樣式
8.5.1 列表樣式list style type屬性
8.5.2 圖像列表list style image屬性
8.5.3 列表符號(hào)位置list style position屬性
8.6 CSS盒模型
8.6.1 CSS盒模型結(jié)構(gòu)
8.6.2 邊界屬性設(shè)置
8.6.3 邊框?qū)傩栽O(shè)置
8.6.4 填充屬性設(shè)置
8.7 CSS+DIV頁(yè)面布局
8.8 綜合實(shí)例
本章小結(jié)
練習(xí)與實(shí)驗(yàn)
練習(xí)8
實(shí)驗(yàn)8
第9章 表格
9.1 表格
9.2 表格標(biāo)記
9.2.1 表格標(biāo)記語(yǔ)法
9.2.2 表格標(biāo)題caption標(biāo)記
9.2.3 表格表頭th標(biāo)記
9.3 表格屬性設(shè)置
9.3.1 表格邊框?qū)傩?br />9.3.2 表格的寬度和高度屬性
9.3.3 表格背景顏色與背景圖像屬性
9.3.4 表格邊框樣式屬性
9.3.5 表格單元格間距、單元格邊距屬性
9.3.6 表格水平對(duì)齊屬性
9.4 設(shè)置表格行的屬性
9.4.1 表格行內(nèi)容水平對(duì)齊的屬性
9.4.2 表格行內(nèi)容垂直對(duì)齊的屬性
9.5 設(shè)置單元格的屬性
9.5.1 表格單元格跨行屬性
9.5.2 表格單元格跨列屬性
9.6 表格嵌套
9.7 綜合實(shí)例
本章小結(jié)
練習(xí)與實(shí)驗(yàn)
練習(xí)9
實(shí)驗(yàn)9
第10章 框架
10.1 框架概述
10.2 框架集的設(shè)置
10.2.1 框架集窗口水平分割
10.2.2 框架集窗口垂直分割
10.2.3 框架集窗口嵌套分割
10.2.4 框架集的邊框
10.2.5 框架集邊框的隱藏
10.3 框架的設(shè)置
10.3.1 框架名稱屬性
10.3.2 框架中顯示網(wǎng)頁(yè)屬性
10.3.3 框架中滾動(dòng)條屬性
10.3.4 框架的邊距屬性
10.3.5 框架尺寸調(diào)整屬性
10.4 浮動(dòng)框架
10.5 框架與超鏈接關(guān)聯(lián)
10.6 綜合實(shí)例
本章小結(jié)
練習(xí)與實(shí)驗(yàn)
練習(xí)10
實(shí)驗(yàn)10
第11章 表單
11.1 表單
11.1.1 表單概述
11.1.2 表單標(biāo)記
11.2 表單信息輸入
11.2.1 單行文本輸入框
11.2.2 密碼輸入框
11.2.3 復(fù)選框
11.2.4 單選按鈕
11.2.5 圖像按鈕
11.2.6 提交按鈕
11.2.7 重置按鈕
11.2.8 普通按鈕
11.2.9 文件選擇框
11.2.1 0隱藏框
11.3 多行文本輸入框
11.4 下拉列表框
11.5 定義域和域標(biāo)題
11.6 綜合實(shí)例
本章小結(jié)
練習(xí)與實(shí)驗(yàn)
練習(xí)11
實(shí)驗(yàn)11
第12章 JavaScript基礎(chǔ)
12.1 JavaScript概述
12.1.1 JavaScript簡(jiǎn)介
12.1.2 第一個(gè)JavaScript程序
12.1.3 JavaScript放置
12.2 JavaScript程序
12.2.1 語(yǔ)句和語(yǔ)句塊
12.2.2 代碼
12.2.3 消息對(duì)話框
12.2.4 JavaScript注釋
12.3 標(biāo)識(shí)符和變量
12.3.1 命名規(guī)范
12.3.2 數(shù)據(jù)類型
12.3.3 變量
12.3.4 轉(zhuǎn)義字符
12.4 運(yùn)算符和表達(dá)式
12.4.1 算術(shù)運(yùn)算符和表達(dá)式
12.4.2 關(guān)系運(yùn)算符和表達(dá)式
12.4.3 邏輯運(yùn)算符和表達(dá)式
12.4.4 賦值運(yùn)算符和表達(dá)式
12.4.5 位運(yùn)算符和表達(dá)式
12.4.6 條件運(yùn)算符和表達(dá)式
12.4.7 其他運(yùn)算符和表達(dá)式
12.5 JavaScript程序控制結(jié)構(gòu)
12.5.1 順序結(jié)構(gòu)
12.5.2 分支結(jié)構(gòu)
12.5.3 循環(huán)結(jié)構(gòu)
12.6 JavaScript函數(shù)
12.6.1 常用系統(tǒng)函數(shù)
12.6.2 自定義函數(shù)
12.6.3 用return返回函數(shù)計(jì)算結(jié)果
12.6.4 函數(shù)變量的作用域
12.7 綜合實(shí)例
本章小結(jié)
練習(xí)與實(shí)驗(yàn)
練習(xí)12
實(shí)驗(yàn)12
第13章 JavaScript事件分析
13.1 JavaScript事件概述
13.1.1 事件類型
13.1.2 事件句柄
13.1.3 事件處理
13.1.4 事件處理程序的返回值
13.2 表單事件
13.2.1 獲得焦點(diǎn)與失去焦點(diǎn)事件
13.2.2 提交及重置事件
13.2.3 改變及選擇事件
13.3 鼠標(biāo)事件
13.3.1 鼠標(biāo)單擊事件
13.3.2 鼠標(biāo)移動(dòng)事件
13.4 鍵盤事件
13.5 窗口事件
13.6 綜合實(shí)例
本章小結(jié)
練習(xí)與實(shí)驗(yàn)
練習(xí)13
實(shí)驗(yàn)13
第14章 DOM和BOM
14.1 常用對(duì)象
14.1.1 Array
14.1.2 Date
14.1.3 Math
14.1.4 Number
14.1.5 String
14.1.6 Boolean
14.2 HTML DOM
14.2.1 DOM簡(jiǎn)介
14.2.2 DOM節(jié)點(diǎn)樹
14.2.3 DOM節(jié)點(diǎn)
14.2.4 DOM節(jié)點(diǎn)訪問
14.2.5 DOM應(yīng)用實(shí)例
14.3 BOM
14.3.1 window對(duì)象
14.3.2 navigator對(duì)象
14.3.3 screen對(duì)象
14.3.4 history對(duì)象
14.3.5 location對(duì)象
14.4 綜合實(shí)例
本章小結(jié)
練習(xí)與實(shí)驗(yàn)
練習(xí)14
實(shí)驗(yàn)14
第15章 課程網(wǎng)站構(gòu)建與發(fā)布
15.1 課程網(wǎng)站結(jié)構(gòu)
15.1.1 網(wǎng)站概況
15.1.2 網(wǎng)站功能需求
15.1.3 網(wǎng)站架構(gòu)設(shè)計(jì)
15.2 課程網(wǎng)站設(shè)計(jì)與實(shí)現(xiàn)
15.2.1 網(wǎng)站頁(yè)面布局設(shè)計(jì)
15.2.2 網(wǎng)站CSS定義
15.2.3 網(wǎng)站首頁(yè)設(shè)計(jì)
15.3 二級(jí)頁(yè)面設(shè)計(jì)
15.3.1 網(wǎng)站首頁(yè)的內(nèi)嵌頁(yè)面設(shè)計(jì)
15.3.2 主講教師頁(yè)面設(shè)計(jì)
15.3.3 網(wǎng)上測(cè)驗(yàn)頁(yè)面設(shè)計(jì)
15.3.4 其他頁(yè)面設(shè)計(jì)
15.4 Web服務(wù)器簡(jiǎn)介
15.5 Web服務(wù)器的安裝、配置與發(fā)布
15.5.1 EasyPHP安裝
15.5.2 EasyPHP配置
15.5.3 Web網(wǎng)站發(fā)布與管理
本章小結(jié)
練習(xí)與實(shí)驗(yàn)
練習(xí)15
實(shí)驗(yàn)15
附錄：模擬試卷
參考文獻(xiàn)