别具光芒 CSS属性、浏览器兼容与网页布局2025|PDF|Epub|mobi|kindle电子书版本百度云盘下载

别具光芒 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善于利用CSS6

1.4.5不要滥用class6

1.4.6应对浏览器6

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

1.5 SEO简介7

第2章 结构XHTML9

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到XHTML12

2.2.1 HTML简史12

2.2.2 HTML的缺点13

2.2.3从HTML到XHTML14

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部分 层叠样式表CSS31

第3章 CSS入门31

3.1 CSS简介32

3.1.1起源32

3.1.2神奇的CSS32

3.1.3 CSS与HTML33

3.14 CSS与浏览器34

3.15 CSS 2.1与CSS234

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 selectors49

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关键字transparent77

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＝URI81

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百分比和em89

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奇怪的IE116

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-bidi126

第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 缩写属性: padding140

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缩写属性border146

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中的position194

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和position209

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缩写属性：background230

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章 济览器与Hack325

16.1浏览器简介326

16.1.1浏览器的发展326

16.1.2浏览器的解释引擎326

16.1.3浏览器的工作模式327

16.2 Windows IE329

16.2.1 hasLayout属性329

16.2.2条件注释338

16.3常用的CSS Hack339

16.3.1 CSSHack原理339

16.3.2 CSS Hack不是必须的340

16.3.3常用的CSSHack340

16.4发现与解决问题343

16.4.1 排查问题343

16.4.2 常见的非Bug问题344

16.4.3 Windows IE常见Bug347

第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