别具光芒 CSS属性、浏览器兼容与网页布局PDF电子书下载

第1部分 Web标准 2

第1章 Web标准概述 2

1.1 Web标准概述 3

1.2表现与结构的分离 3

1.3易用性 4

1.4难点所在 5

1.4.1 DIV＋CSS不等于Web标准 5

1.4.2正确使用XHTML标签 5

1.4.3表格本身并没有被抛弃 6

1.4.4善于利用CSS 6

1.4.5不要滥用class 6

1.4.6应对浏览器 6

1.4.7.通过验证”并不是最终目的 7

1.5 SEO简介 7

第2章 结构XHTML 9

2.1理解结构与表现 10

2.1.1内容 10

2.1.2结构（Structure） 11

2.1.3表现（Presentation） 11

2.1.4行为（Behavior） 12

2.2从HTML到XHTML 12

2.2.1 HTML简史 12

2.2.2 HTML的缺点 13

2.2.3从HTML到XHTML 14

2.3理解（X）HTML标签的语义 18

2.3.1（X）HTML与浏览器默认样式 18

2.3.2常用的XHTML标签和属性 19

2.3.3（X）HTML各个元素对搜索引擎的权重比例 27

2.4网站整体制作基本流程 27

2.4.1总体流程与分工 27

2.4.2静态页面制作 28

第2部分 层叠样式表CSS 31

第3章 CSS入门 31

3.1 CSS简介 32

3.1.1起源 32

3.1.2神奇的CSS 32

3.1.3 CSS与HTML 33

3.14 CSS与浏览器 34

3.15 CSS 2.1与CSS2 34

3.2 CSS的使用方法 34

3.2.1行内式样式（linlin style） 35

3.2.2嵌入式样式表（Embedded style sheets） 35

3.2.3外部样式表（Link style sheets） 35

3.2.4导入式样式表 37

3.2.5应用 38

3.2.6维护和组织样式表 38

3.3基本样式规则 39

3.3.1基本语法 39

3.3.2继承与层叠 40

3.3.3分组 40

3.3.4注释 41

3.3.5缩写 41

3.3.6注意事项 43

3.4元素类型 43

3.4.1替换和不可替换元素 44

3.4.2显示元素 44

3.5媒体类型 45

3.5.1指定媒体相关的样式表 45

3.5.2媒体组 45

第4章 文档结构与选择器 47

4.1文档结构 48

4.2 CSS选择器 49

4.21通配选择器（Universal selector） 49

4.2.2类型选择器（Type selectors 49

4.2.3 ID选择器（ID Selectors） 50

4.2.4类选择器（Class selectors） 50

4.2.5包含选择器（Descendant selectors） 51

4.2.6子元素选择器（Child selectors） 52

4.2.7相邻兄弟选择器（Adjacent sibling selectors） 52

4.2.8属性选择器（Attribute selectors） 53

4.3伪类与伪元素 56

4.3.1伪类（Pseudo-Classes） 56

4.3.2伪元素（Pseudo-Elements） 59

4.3.3注意 61

4.4指定值、计算值和实际值 62

4.5继承 63

4.5.1值的继承 62

4.5.2 “inherit”值 63

4.5.3继承的局限性 63

4.6层叠 64

4.6.1层叠的顺序 64

4.6.2特殊性的计算 65

4.6.3继承和特殊性 65

4.6.4重要性 66

4.6.5非CSS的表现类内容 66

4.7 CSS 3新增选择器前瞻 67

4.7.1更多的属性选择器 67

4.7.2普通兄弟选择器 68

4.7.3结构伪类（Structural Pseudo-Classes） 69

4.7.4 UI元素伪类和伪元素 70

4.7.5其他伪类 70

4.8命名规范 71

4.9选择器综合运用 72

第5章 单位和值 74

5.1颜色＜Color＞ 75

5.1.1颜色关键字 75

5.1.2 RGB颜色 75

5.1.3关键字transparent 77

5.1.4网页安全色（Web-safe Colors ） 77

5.2整数值＜integer＞和实数值＜number＞ 78

5.3长度＜length＞ 78

5.3.1格式 78

5.3.2长度单位 78

5.3.3应用 80

5.4百分比＜percentage＞ 80

5.5关键字 81

5.6字符串＜string＞ 81

5.7 URL＋URN＝URI 81

5.8其他值 82

5.8.1记数器＜counter＞ 82

5.8.2角度＜angle＞ 82

5.8.3时间＜time＞ 83

5.8.4频率＜frequency＞ 83

5.9不支持的值的处理 83

第6章 字体 84

6.1字体集：font-family属性 85

6.1.1语法 85

6.1.2常用字体系列 85

6.2字体尺寸：font-size属性 87

6.2.1语法 87

6.2.2绝对尺寸 88

6.2.3相对尺寸 89

6.2.4百分比和em 89

6.2.5尺寸的继承与浏览器的显示 90

6.2.6分辨率与弹性设计 91

6.3字体磅值：font-weight属性 91

6.3.1语法 92

6.3.2继承 92

6.3.3浏览器显示原理 93

6.4字体样式：font-style属性 94

6.5字体变形：font-variant属性 95

6.6缩写的字体属性：font属性 95

6.6.1语法 95

6.6.2注意 96

6.6.3系统字体 97

6.7调整与拉伸 98

6.7.1字体调整：font-size-adiust属性 98

6.7.2字体伸展：font-stretch属性 99

6.8字体匹配原理 99

6.8.1字体的匹配步骤 99

6.8.2设定字体集的注意事项 100

6.8.3字体的选择 100

6.8.4@font-face规则 101

第7章 文本 102

7.1文本水平对齐：text-align属性 103

7.1.1语法 103

7.1.2适用于：块级元素 103

7.1.3继承 104

7.1.4应用：整体居中 104

7.2文本缩进：text-indent属性 105

7.2.1 语法 106

7.2.2 正值缩进 107

7.2.3 负值缩进 107

7.2.4 应用:隐藏单行文字 107

7.3 行高line-heightl属性 108

7.3.1语法 108

7.3.2内容区域、行内框和行框 109

7.3.3行高的计算与继承 110

7.3.4济览器的差别与错误 111

7.3.5应用：单行文字在垂直方向居中 112

7.4垂直对齐：vertical-align属性 112

7.4.1语法 112

7.4.2属性值详解 113

7.4.3奇怪的IE 116

7.4.4文档类型与纯图片内容的垂直对齐 116

7.4.5单元格的垂直对齐 118

7.5单词间隔（word-spacing）和字母间隔（letter-spacing） 119

7.5.1单词间隔：word-spacing属性 119

7.5.2字母间隔：letter-spacing属性 120

7.5.3水平对齐的影响和继承 120

7.6文本转换：text-transform属性 121

7.7文本装饰：text-decoration属性 121

7.8空白：white-space属性 123

7.8.1语法 123

7.8.2属性值详解 123

7.8.3应用：显示不回行文本 124

7.9文本阴影：text-shadow属性 125

7.10文字方向direction和编码方式unicode-bidi 126

第8章 框模型 128

8.1 框模型（Box Model） 129

8.2包含块（Containing Block） 131

8.2.1视口（viewport） 131

8.2.2包含块 131

8.3宽度：width属性 133

8.3.1语法 133

8.3.2行内元素的宽度 134

8.3.3长度和百分比 135

8.4最大宽度（max-width）和最小宽度（min-width） 136

8.5高度：height属性 137

8.5.1语法 137

8.5.2行内元素的高度 138

8.6最大高度 （max-height）和最小高度（min-height） 138

8.7补白:padding属性 140

8.7.1 缩写属性: padding 140

8.7.2 补白宽度和高度 141

8.7.3 百分比值补白 141

8.8边框：border属性 142

8.8.1边框颜色 142

8.8.2边框宽度 143

8.8.3边框样式 144

8.8.4不同方向的边框属性缩写 146

8.8.5缩写属性border 146

8.8.6行内元素的边框 147

8.8.7应用：文字链接的装饰 147

8.9边距：margin属性 148

8.9.1水平方向的边距：margin-left属性和margin-right属性 149

8.9.2垂直方向的边距：margin-top属性和margin-bottom属性 150

8.9.3百分比值边距 153

8.9.4负值边距 154

8.9.5应用：元素水平居中 155

8.10常规流向中的视觉格式化 156

8.10.1块级元素的水平格式化 156

8.10.2应用：宽度自适应的布局 160

8.10.3块级元素的垂直格式化 161

8.10.4应用：高度自适应浏览器窗口 163

8.10.5行内元素的格式化 164

第9章 浮动、定位与视觉格式化模型 167

9.1视觉格式化模型控制框的生成 168

9.1.1块框的生成（block box） 168

9.1.2行内框（inline box） 169

9.1.3插入框（run-in box） 170

9.2显示类型：display属性 170

9.2.1语法 171

9.2.2应用：显示或隐藏元素 173

9.3定位 174

9.3.1选择定位方式：position属性 174

9.3.2设定框偏移：top、right、bottom、left属性 174

9.3.3相对定位 176

9.3.4绝对定位 178

9.3.5堆叠顺序：z-index属性 191

9.3.6 IE中的position 194

9.3.7应用：显示提示内容 195

9.4浮动与清除 197

9.4.1设定浮动：float属性 197

9.4.2浮动元素的视觉格式化内容 198

9.4.3清除浮动：clear属性 204

9.4.4 应用：3行3列布局设计 207

9.5 display、float和position 209

9.6 溢出和剪切 209

9.6.1 溢出：Overflow属性 210

9.6.2剪切：clip属性 212

9.6.3clip 与overflow属性的关系 214

9.7可视性：visibility属性 215

9.7.1属性值详解 215

9.7.2应用：显示及隐藏元素 216

第10章 颜色与背景 217

10.1颜色基础 218

10.2前景色：color属性 219

10.2.1链接 220

10.2.2边框 221

10.2.3表单元素 221

10.3背景 222

10.3.1背景颜色：background-color属性 222

10.3.2背景图片：background-image属性 223

10.3.3背景图片重复：background-repeat属性 224

10.3.4背景图片附属：background-attachment属性 225

10.3.5背景图片定位：background-position属性 226

10.3.6缩写属性：background 230

10.3.7 ＜html＞元素的背景 231

10.4应用 232

10.4.1灵活使用背景 232

10.4.2模拟边框 233

10.4.3简单的链接背景替换 237

10.4.4导航菜单的滑动门效果 239

第11章 表格 244

11.1表格的标签与属性 245

11.1.1标签概览 245

11.1.2 （X）HTML属性 248

11.2 CSS的表格模型 251

11.2.1表格模型概述 251

11.2.2 display属性 251

11.2.3匿名表格对象 253

11.2.4列 253

11.3表格的视觉格式化 254

11.3.1匿名框、标题框与表格框 254

11.3.2标题＜caption＞的定位：caption-side属性 254

11.3.3表格内容的视觉布局 255

11.3.4表格的层和透明性 256

11.3.5表格宽度算法：table-layout属性 258

11.3.6表格高度 263

11.3.7 单元格内要容的对齐 264

11.4单元格边框:border-collapse属性 266

11.4.1 分离的边框模型 267

11.4.2重台的边框模型 269

11.4.3边框样式 272

第12章 列表和生成的内容 273

12.1列表 274

12.1.1列表样式类型：list-style-type属性 274

12.1.2列表样式图片：list-style-image属性 276

12.1.3列表样式定位：list-style-position属性 277

12.1.4列表样式缩写：list-style属性 278

12.1.5浏览器对列表的表现与样式的继承 278

12.2生成的内容 280

12.2.1 :before和：after伪元素 281

12.2.2生成内容：content属性 281

12.2.3自动记数和编号 285

第13章 用户界面 291

13.1鼠标指针：cursor属性 292

13.1.1关键字 292

13.1.2图片鼠标指针 293

13.2系统字体和颜色 294

13.2.1系统字体 294

13.2.2系统颜色 295

13.3动态的外廓：outline属性 296

13.3.1外廓与边框的区别 296

13.3.2外廓宽度：outline-width属性 297

13.3.3外廓样式：outline-style属性 297

13.3.4外廓颜色：outline-color属性 298

13.3.5缩写：outline属性 298

13.3.6外廓与焦点 299

第14章 页面媒体 300

14.1页面媒体简介 301

14.2指定媒体类型 301

14.3页框：＠page规则 302

14.3.1页边柜 302

14.3.2页面选择器 303

14.4分页 304

14.4.1元素前后分页：page-break-berfore和page-break-after属性 304

14.4.2元素内部分页：Page-break-inside属性 306

14.4.3元素内的分割：Orphans和windows属性 306

14.4.4分页的规则 308

14.5 CSS2中的属性 309

14.5.1页框尺寸：size属性 309

14.5.2裁切标记：marks属性 310

14.5.3使用命名的页：page属性 310

14.6显示器、打印机和投影 310

14.6.1设备特点 311

14.6.2设计要点 311

第15章 听觉样式表 313

15.1听觉（aural）类型与语音（speech）类型 314

15.1.1链接听觉样式的特点 314

15.1.2与听觉属性相关的值 314

15.2音量属性：volume属性 314

15.3发音：speak属性 315

15.4暂停：pause-before、pause-after和pause属性 316

15.5提示：cue-before、cue-after和cue属性 317

15.6混音：play-during属性 318

15.7空间：azimuth和elevation属性 318

15.8语音特征属性 320

15.9语音：speak-punctuation和speak-numeral属性 323

15.10叙述表头：speak-header属性 323

第16章 济览器与Hack 325

16.1浏览器简介 326

16.1.1浏览器的发展 326

16.1.2浏览器的解释引擎 326

16.1.3浏览器的工作模式 327

16.2 Windows IE 329

16.2.1 hasLayout属性 329

16.2.2条件注释 338

16.3常用的CSS Hack 339

16.3.1 CSSHack原理 339

16.3.2 CSS Hack不是必须的 340

16.3.3常用的CSSHack 340

16.4发现与解决问题 343

16.4.1 排查问题 343

16.4.2 常见的非Bug问题 344

16.4.3 Windows IE常见Bug 347

第3部分 结构化实例 356

第17章 旅游网站 356

17.1结构化 357

17.1.1分析内容结构 357

17.1.2基本结构 358

17.1.3页首部分的结构化 359

17.1.4中间部分的结构化 361

17.1.5页脚部分的结构化 368

17.2图片格式与网络基础知识 369

17.2.1图片格式 369

17.2.2图片与优化 370

17.3 CSS美化 371

17.3.1整体分析 371

17.3.2 header层 377

17.3.3 logo层 378

17.3.4 mainNav层 378

17.3.5 login层 381

17.3.6 controlMenu层 385

17.3.7 main层 394

17.3.8 travels层 395

17.3.9 hot层 399

17.3.10 adl层 403

17.3.11 photos层 402

17.3.12 forumList层 404

17.3.13 forumHot层 405

17.3.14 club层 410

17.3.15 vote层和community层 412

17.3.16 footer层 413

17.4版式与结构 415

17.5小结 416