动态网页设计案例教程PDF|Epub|txt|kindle电子书版本网盘下载

动态网页设计案例教程PDF格式电子书版下载

注意：本站所有压缩包均有解压码： 点击下载压缩包解压工具

第1章 HTML 4.0简介1

1.1 初识HTML1

1.1.1 HTML是什么1

1.1.2 初步尝试1

1.1.3 HTML文档的注释4

1.2 文档头4

1.2.1 可在文档头部分使用的标识符5

1.2.2 meta标识符5

1.3 网页的页面属性5

1.3.1 定义背景色、背景图片和文字色彩6

1.3.2 设置网页空白6

1.4 链接7

1.4.1 基本语法7

1.4.2 在新窗口中打开链接8

1.4.3 用链接实现发信9

1.5 字体样式9

1.5.1 标题字体9

1.5.2 设置字号10

1.5.3 设置物理字体和逻辑字体11

1.5.4 设置字模12

1.5.5 设置文字颜色13

1.5.6 字体设置标识符的组合使用13

1.6 网页布局13

1.6.1 设置标尺线13

1.6.2 行的控制14

1.6.3 文字的对齐方式15

1.6.4 列表16

1.6.5 预排格式化文本19

1.6.6 标识符<address>和</address>20

1.6.7 标识符<blockquote>和</blockquote>20

1.6.8 空白区域20

1.7 图像21

1.7.1 基本语法21

1.7.2 图像在网页中的布局22

1.7.3 设置图像的大小和边框宽度24

1.8 表格25

1.8.1 定义表格的基本语法25

1.8.2 设置表格外观26

1.8.3 跨多行多列的表元28

1.8.4 控制表格内文字的布局29

1.8.5 控制表格在网页中的布局30

1.9 多窗口结构30

1.9.1 基本语法30

1.9.2 设置各窗口的尺寸31

1.9.3 框架的嵌套33

1.9.4 框架各窗口之间的关系33

1.9.5 设置框架的外观33

1.9.6 浮动窗口34

1.10 表单35

1.10.1 表单的基本结构35

1.10.2 普通按钮和图像按钮35

1.10.3 下拉菜单36

1.10.4 复选框37

1.10.5 单选按钮38

1.10.6 提交和重置按钮39

1.10.7 文字和密码输入39

1.10.8 文本区域40

1.11 <Script>、<Applet>和<Style>标识符40

1.12 本章知识点回顾41

第2章 CSS基础50

2.1 范例1：设置链接效果50

2.1.1 效果说明50

2.1.2 样式表的基本结构50

2.1.3 设置链接效果的样式规则52

2.1.4 把样式表嵌入到HTWIL文档头52

2.1.5 样式表和HTWL的关系53

2.2 范例2：设置鼠标光标的形状54

2.2.1 效果说明54

2.2.2 用于设置鼠标光标形状的样式规则54

2.2.3 在代码行中加入样式55

2.2.4 指定鼠标光标的形状57

2.3 范例3：首字下沉与首行大写59

2.3.1 效果说明59

2.3.2 分类60

2.3.3 使用分类实现首字下沉和首行大写62

2.3.4 情景选择64

2.3.5 使用情景选择实现首字下沉和首行大写65

2.4 范例4:为不同文本定义不同样式68

2.4.1 效果说明68

2.4.2 class属性68

2.4.3 id属性71

2.4.4 span元素72

2.4.5 div元素76

2.4.6 使用多个样式规则时的优先级77

2.5 范例5：外部CSS文件77

2.5.1 将样式表嵌入HTML文档的方法77

2.5.2 链接到外部CSS文件78

2.5.3 输入外部样式表80

2.6 本章知识点回顾82

第3章 设置字体样式88

3.1 范例6：字体风格88

3.1.1 效果说明88

3.1.2 设置字体风格的样式规则88

3.1.3 创建步骤88

3.2 范例7：按照字模系列名称调用字体89

3.2.1 效果说明89

3.2.2 设置字模系列的样式规则90

3.2.3 创建步骤90

3.3 范例8：自由控制字号91

3.3.1 控制字号的样式规则91

3.3.2 以point为单位控制字号92

3.3.3 以em为单位控制字号92

3.3.4 以pixel为单位控制字号93

3.3.5 以其他单位控制字号93

3.3.6 使用关键字控制字号94

3.3.7 使用比例尺寸控制字号95

3.4 范例9：控制字重96

3.4.1 效果说明96

3.4.2 设置字重的样式规则96

3.5 范例10：文字变形97

3.5.1 效果说明97

3.5.2 设置文字变形的样式规则97

3.6 范例11：文字修饰98

3.6.1 效果说明98

3.6.2 设置文字修饰的样式规则98

3.7 范例12：设置文字的颜色99

3.7.1 使用英文名称来设置颜色99

3.7.2 使用16进制数来设置颜色100

3.7.3 使用rgb模式来设置颜色102

3.8 范例13：设置文字的背景颜色104

3.8.1 设置黑底白字效果104

3.8.2 为多种网页元素设置背景颜色105

3.9 范例14：设置文字的背景图像107

3.9.1 设置背景图像的样式规则107

3.9.2 设置背景图像的范例107

3.10 范例15：控制文字是否显示108

3.10.1 display属性108

3.10.2 范例108

3.11 范例16：设置列表项的标记109

3.11.1 list-style-type属性109

3.11.2 使用list-style-type属性设置UL标记110

3.11.3 使用list-style-type属性设置OL标记111

3.11.4 list-style-image属性112

3.11.5 list-style属性113

3.12 范例17：笔记本网页效果113

3.12.1 效果说明113

3.12.2 代码114

3.12.3 font属性116

3.13 本章知识点回顾117

第4章 控制页面布局121

4.1 范例18：设置字母间距和单词间距121

4.1.1 设置字母间距121

4.1.2 设置单词间距123

4.2 范例19：控制行距124

4.2.1 控制行距的方法124

4.2.2 用数字设置行高124

4.2.3 使用长度单位设置行高126

4.2.4 使用比例设置行高126

4.3 范例20：让文字互相重叠127

4.4 范例21：文字对齐128

4.4.1 样式规则128

4.4.2 水平对齐的一个范例129

4.4.3 对表格的各表元内容进行对齐的范例129

4.5 范例22：文字缩行133

4.5.1 样式规则133

4.5.2 缩行的范例133

4.6 范例23：设置空白区域135

4.6.1 box与间隙、边框、空白区域135

4.6.2 设置空白区域的样式规则135

4.6.3 设置空白区域的范例136

4.7 范例24：设置间隙和边框139

4.7.1 设置间隙的样式规则139

4.7.2 边框的4个属性140

4.7.3 设置边框的宽度140

4.7.4 设置边框的颜色141

4.7.5 设置边框的风格142

4.7.6 设置边框的范例142

4.7.7 设置间隙和边框的范例147

4.8 范例25：设置环绕效果149

4.8.1 设置环绕的样式规则150

4.8.2 设置环绕的范例150

4.9 范例26：设置背景151

4.9.1 添加背景颜色和背景图像151

4.9.2 控制背景图像是否平铺151

4.9.3 控制背景图像是否固定154

4.9.4 控制背景图像的显示位置155

4.9.5 使用background属性设置背景157

4.10 范例27：错乱的网页效果158

4.10.1 效果说明158

4.10.2 代码158

4.11 范例28：报纸网页效果162

4.11.1 效果说明162

4.11.2 代码162

4.12 本章知识点回顾167

第5章 定位与叠放172

5.1 范例29：绝对定位与相对定位172

5.1.1 绝对定位172

5.1.2 相对定位175

5.2 范例30:设置网页元素的宽度和高度178

5.2.1 设置宽度178

5.2.2 同一图像以不同宽度显示178

5.2.3 阶梯状显示的文本179

5.2.4 设置高度180

5.3 范例31：设置网页元素的可视性181

5.3.1 visibility属性181

5.3.2 范例：突然消失的按钮182

5.4 范例32:叠放文字和图像183

5.4.1 z-index属性183

5.4.2 范例：将两张图片组合为一184

5.5 范例33：定位方法的综合应用185

5.5.1 效果说明185

5.5.2 创建步骤186

5.6 范例34：图片文字效果188

5.6.1 效果说明188

5.6.2 创建步骤189

5.7 范例35：光标瞄准器特效194

5.7.1 效果说明194

5.7.2 创建步骤194

5.8 本章知识点回顾196

第6章 CSS滤镜(Filter)199

6.1 范例36：认识滤镜199

6.1.1 什么是滤镜199

6.1.2 滤镜效果示例199

6.2 范例37：定义一个或多个滤镜效果201

6.2.1 定义一个滤镜效果201

6.2.2 定义多个滤镜效果202

6.2.3 多个滤镜效果的应用顺序203

6.2.4 应用滤镜效果时的注意事项204

6.3 范例38：Alpha通道滤镜效果206

6.3.1 Alpha通道效果的效果及定义206

6.3.2 一个范例207

6.3.3 代码的解释：使用脚本动态设置滤镜的属性208

6.3.4 滤镜数组210

6.4 范例39：移动模糊(Motion Blur)213

6.4.1 效果和定义213

6.4.2 范例213

6.5 范例40：色度(Chroma)216

6.5.1 效果及定义216

6.5.2 范例216

6.6 范例41：下落阴影(Drop Shadow)217

6.6.1 效果及定义217

6.6.2 范例217

6.7 范例42：翻转(Flip)218

6.7.1 效果及定义218

6.7.2 范例218

6.8 范例43：光晕(Glow)218

6.8.1 效果及定义218

6.8.2 范例219

6.9 范例44：灰度(Grayscale)219

6.9.1 效果及定义219

6.9.2 范例220

6.10 范例45：反相(Invert)220

6.10.1 效果及定义220

6.10.2 范例220

6.11 范例46：遮蔽(Mask)221

6.11.1 效果及定义221

6.11.2 范例221

6.12 范例47：阴影(Shadow)222

6.12.1 效果及定义222

6.12.2 范例222

6.13 范例48：波形(Wave)223

6.13.1 效果及定义223

6.13.2 范例223

6.14 范例49：X光效果(X-ray)224

6.14.1 效果及定义224

6.14.2 范例224

6.15 本章知识点回顾225

第7章 JavaScript与CSS的结合应用230

7.1 范例50：图片播放效果230

7.1.1 效果说明230

7.1.2 客户端映射图232

7.1.3 使用“层”使图文重叠234

7.1.4 完整代码234

7.2 范例51：光晕文字特效236

7.2.1 效果说明236

7.2.2 实现方法237

7.3 范例52：固定于网页某一位置的菜单239

7.3.1 效果说明239

7.3.2 实现方法240

7.4 范例53：可拖动的图文243

7.4.1 效果说明243

7.4.2 实现方法244

7.4.3 进一步实践：可拖动的DIV247

7.4.4 同时兼容Netscape和IE248

7.5 范例54：神奇的导航图252

7.5.1 效果说明252

7.5.2 客户端映射图254

7.5.3 定位和叠放255

7.5.4 设置和导航菜单各项相对应的显示层(DIV)256

7.5.5 实现图像变形的动画效果257

7.6 范例55：飞行的图片264

7.6.1 效果说明264

7.6.2 实现方法266

7.7 本章知识点回顾268

附录1 CSS与浏览器的兼容性271

f1.1 样式表基础271

f1.2 字体样式272

f1.3 文字274

f1.4 颜色与背景275

f1.5 页面布局276

f1.6 层和定位(CSS2)279

附录2 CSS2新增选择符280

f2.1 ？(通配符选择符)280

f2.2 >(子选择符)280

f2.3 +(近亲选择符)280

f2.4 ［］(属性搭配选择符)281

附录3 样式表度量单位值282

f3.1 %282

f3.2 cm282

f3.3 em282

f3.4 ex(x-height)283

f3.5 in283

f3.6 mm283

f3.7 pc284

f3.8 pt284

f3.9 px284

附录4 样式表颜色值285

f4.1 英文名称表示的颜色值285

f4.2 6个数字的16进制颜色值285

f4.3 3个数字的16进制颜色值285

f4.4 RGB颜色值286

f4.5 使用百分比值的RGB颜色值286