精通CSS高JWeb标准解决方案-(第3版)( 货号:711550690) 下载 pdf 百度网盘 epub 免费 2025 电子书 mobi 在线

基本信息

商品名称： 精通CSS高JWeb标准解决方案-(第3版)

出版社： 人民邮电出版社

出版时间：2019-02-01

作者：安迪.巴德

译者：李松峰

开本： 16开

定价： 99.00

页数：374

印次： 1

ISBN号：9787115506900

商品类型：图书

版次： 1

目录

第1章 基础知识 1

1.1 组织代码 1

1.1.1 可维护性 2

1.1.2 HTML简史 2

1.1.3 渐进增强 5

1.2 创建结构化、语义化富HTML 7

1.2.1 ID和class属性 9

1.2.2 结构化元素 10

1.2.3 div和span 12

1.2.4 重新定义的表现性文本元素 12

1.2.5 扩展HTML语义 13

1.2.6 验证 15

1.3 小结 16

第2章 添加样式 17

2.1 CSS选择符 17

2.1.1 子选择符与同辈选择符 18

2.1.2 通用选择符 20

2.1.3 属性选择符 21

2.1.4 伪元素 22

2.1.5 伪类 23

2.1.6 结构化伪类 25

2.1.7 表单伪类 27

2.2 层叠 28

2.3 特殊性 29

2.3.1 利用层叠次序 30

2.3.2 控制特殊性 30

2.3.3 特殊性与调试 32

2.4 继承 33

2.5 为文档应用样式 34

2.5.1 link与style元素 35

2.5.2 性能 36

2.6 小结 37

第3章 可见格式化模型 38

3.1 盒模型 38

3.1.1 盒子大小 39

3.1.2 Z大值和Z小值 43

3.2 可见格式化模型 43

3.2.1 匿名盒子 45

3.2.2 外边距折叠 45

3.2.3 包含块 47

3.2.4 相对定位 48

3.2.5 定位 48

3.2.6 固定定位 49

3.2.7 浮动 50

3.2.8 格式化上下文 54

3.2.9 内在大小与外在大小 56

3.3 其他CSS布局模块 56

3.3.1 弹性盒布局 57

3.3.2 网格布局 57

3.3.3 多栏布局 57

3.3.4 Region 57

3.4 小结 58

第4章 网页排版 59

4.1 CSS的基本排版技术 59

4.1.1 文本颜色 61

4.1.2 字体族 61

4.1.3 字型大小与行高 63

4.1.4 行间距、对齐及行盒子的构造 65

4.1.5 文本粗细 68

4.1.6 字体样式 69

4.1.7 大小写变换和小型大写变体 69

4.1.8 控制字母和单词间距 70

4.2 版心宽度、律动和毛边 71

4.2.1 文本缩进与对齐 72

4.2.2 连字符 74

4.2.3 多栏文本 74

4.3 Web字体 79

4.3.1 许可 80

4.3.2 @font-face规则 81

4.3.3 Web字体、浏览器与性能 84

4.3.4 使用JavaScript加载字体 85

4.4 高J排版特性 87

4.4.1 数字 89

4.4.2 字距选项及文本渲染 90

4.5 文本特效 91

4.5.1 合理使用文本阴影 91

4.5.2 使用JavaScript提升排版品质 93

4.6 寻找灵感 95

4.7 小结 95

第5章 漂亮的盒子 96

5.1 背景颜色 96

5.2 背景图片 99

5.2.1 背景图片与内容图片 99

5.2.2 简单的背景图片示例 100

5.2.3 加载图片(以及其他文件) 102

5.2.4 图片格式 103

5.3 背景图片语法 104

5.3.1 背景位置 104

5.3.2 背景裁剪与原点 107

5.3.3 背景附着 108

5.3.4 背景大小 108

5.3.5 背景属性简写 110

5.4 多重背景 111

5.5 边框与圆角 113

5.5.1 边框半径：圆角 113

5.5.2 创建正圆和胶囊形状 115

5.5.3 边框图片 117

5.6 盒阴影 118

5.6.1 扩展半径：调整阴影大小 119

5.6.2 内阴影 119

5.6.3 多阴影 120

5.7 渐变 121

5.7.1 浏览器支持与浏览器前缀 122

5.7.2 线性渐变 122

5.7.3 放射渐变 124

5.7.4 重复渐变 125

5.7.5 把渐变当作图案 126

5.8 为嵌入图片和元素添加样式 129

5.8.1 可伸缩的图片模式 129

5.8.2 控制对象大小的新方法 130

5.8.3 可保持宽高比的容器 131

5.8.4 减少图片大小 133

5.9 小结 134

第6章 内容布局 135

6.1 定位 135

6.1.1 定位的应用场景 136

6.1.2 定位与z-index：堆叠内容的陷阱 140

6.2 水平布局 141

6.2.1 使用浮动 142

6.2.2 行内块布局 144

6.2.3 使用表格显示属性实现布局 150

6.2.4 不同技术优缺点比较 151

6.3 Flexbox 152

6.3.1 浏览器支持与语法 152

6.3.2 理解Flex方向：主轴与辅轴 152

6.3.3 对齐与空间 154

6.3.4 可伸缩的尺寸 158

6.3.5 Flexbox布局 163

6.3.6 列布局与个别排序 167

6.3.7 嵌套的Flexbox布局 170

6.3.8 Flexbox不可用怎么办 171

6.3.9 Flexbox的bug与提示 172

6.4 小结 173

第7章 页面布局与网格 174

7.1 布局规划 174

7.1.1 网格 174

7.1.2 布局辅助类 175

7.1.3 使用现成的框架 176

7.1.4 固定、流动还是弹性 177

7.2 创建灵活的页面布局 178

7.2.1 包装元素 179

7.2.2 行容器 181

7.2.3 创建列 181

7.2.4 流式空距 186

7.2.5 增强列：包装与等高 190

7.2.6 作为网页布局通用工具的Flexbox 193

7.3 二维布局：CSS Grid Layout 194

7.3.1 网格布局的术语 195

7.3.2 定义行和列 196

7.3.3 添加网格项 198

7.3.4 自动网格定位 201

7.3.5 网格模板区 204

7.4 小结 206

第8章 响应式Web设计与CSS 207

8.1 一个例子 207

8.1.1 简单上手 207

8.1.2 媒体查询 208

8.1.3 加入更多断点 210

8.2 响应式Web设计的起源 212

8.3 浏览器视口 214

8.3.1 视口定义的差别 214

8.3.2 配置视口 216

8.4 媒体类型与媒体查询 218

8.4.1 媒体类型 218

8.4.2 媒体查询 218

8.5 响应式设计与结构化CSS 221

8.5.1 移动优先的CSS 221

8.5.2 媒体查询放在何处 224

8.6 几种响应式设计模式 224

8.6.1 响应式文本列 224

8.6.2 没有媒体查询的响应式Flexbox 225

8.6.3 响应式网格与网格模板区 227

8.7 响应式布局之外 231

8.7.1 响应式背景图片 231

8.7.2 响应式嵌入媒体 233

8.7.3 响应式排版 239

8.8 小结 243

第9章 表单与数据表 244

9.1 设计数据表 244

9.1.1 表格专有元素 245

9.1.2 为表格应用样式 247

9.1.3 响应式表格 250

9.2 表单 254

9.2.1 简单的表单 255

9.2.2 表单反馈与帮助 264

9.2.3 高J表单样式 267

9.3 小结 276

第10章 变换、过渡与动画 277

10.1 概述 277

10.2 二维变换 278

10.2.1 变换原点 281

10.2.2 平移 282

10.2.3 多重变换 283

10.2.4 缩放和变形 286

10.2.5 二维矩阵变换 287

10.2.6 变换与性能 288

10.3 过渡 289

10.3.1 过渡计时函数 291

10.3.2 使用不同的正向和反向过渡 294

10.3.3 “粘着”过渡 294

10.3.4 延迟过渡 294

10.3.5 过渡的能与不能 295

10.4 CSS关键帧动画 297

10.4.1 动画与生命的幻象 297

10.4.2 曲线动画 301

10.5 三维变换 303

10.5.1 透视简介 304

10.5.2 创建三维部件 306

10.5.3 高J三维变换 310

10.6 小结 311

第11章 高J特效 312

11.1 CSS Shapes 314

11.2 剪切与蒙版 320

11.2.1 剪切 320

11.2.2 蒙版 325

11.2.3 透明JPEG与SVG蒙版 327

11.3 混合模式与合成 330

11.3.1 给背景图片上色 331

11.3.2 混合元素 332

11.4 CSS中的图像处理：滤镜 336

11.4.1 调色滤镜 336

11.4.2 高J滤镜与SVG 341

11.5 应用特效的次序 344

11.6 小结 344

第12章 品控与流程 345

12.1 外部代码质量：调试CSS 345

12.1.1 浏览器如何解析CSS 346

12.1.2 优化渲染性能 349

12.2 内部代码质量：以人为本 353

12.2.1 理解CSS 353

12.2.2 代码质量的例子 354

12.2.3 管理层叠 357

12.2.4 结构命名与CSS方法论 357

12.2.5 管理复杂性 360

12.2.6 代码是写给人看的 363

12.3 工具与流程 364

12.4 工作流工具 367

12.4.1 静态分析及Linter 367

12.4.2 构建工具 367

12.5 未来的CSS语法与结构 370

12.5.1 CSS变量：自定义属性 370

12.5.2 HTTP/2与服务器推送 371

12.5.3 Web组件 372

12.5.4 CSS与可扩展的Web 373

12.6 小结 374

安迪•巴德（Andy Budd）

数字设计咨询公司Clearleft联合创始人，Web标准倡导者。目前专注于用户体验设计领域。

埃米尔•比约克隆德（Emil Björklund）

数字设计咨询公司inUse技术总监，拥有十余年专业Web开发经验，从客户端JavaScript到服务器端Python都有深入研究。

暂无出版社相关信息，正在全力查找中！

暂无相关书籍摘录，正在全力查找中！

在线阅读地址：精通CSS高JWeb标准解决方案-(第3版)( 货号:711550690)在线阅读

在线听书地址：精通CSS高JWeb标准解决方案-(第3版)( 货号:711550690)在线收听

在线购买地址：精通CSS高JWeb标准解决方案-(第3版)( 货号:711550690)在线购买

所有CSS布局的根本都是3个基本概念：定位、浮动、margin操纵。

在符合标准的浏览器中，如果元素的内容太大，它只会超出box之外。但是，IE会扩展整个元素（。。。-_-）

Meaningful markup provides the developer with several important benefits. Meaningful pages are much easier to work with than presentational ones. For example, say you need to change a quotation on a page. If the quotation is marked up correctly, it is easy to scan through the code until you find the first blockquote element. However, if the quotation is just another paragraph element, it will be a lot harder to find. For a more complicated, but no less realistic example, say that you needed to add an extra column to your homepage. You could simply drop the content in at the right point and then update the widths in your CSS. To do the same in a table-based layout you’d need to add an extra column in your table, change the colspan settings, alter the widths on all the cells, and change the ...

When naming your IDs and classes, it is important that you keep the names as “unpresentational” as possible. For instance, if you want all of your form notification messages to be red, you could give them a class of red. This is fine as long as there are no other red elements on the page.

However, say you wanted to style required form labels red as well. You are now forced to guess to which element that class could refer, and things are already starting to get confusing. Imagine how confusing the code could become if you used presentational elements across the whole site?

This gets even more complicated if you decide to change the presentation of your form notifications from red to yellow. Now, you either have to go back and change all your class names, or you have an element called red th...

At the same time, they can be overused and even abused. Novice CSS authors often add classes to nearly everything in an attempt to get fine-grained control over their styles. Early WYSIWYG editors also had the tendency to add classes each time a style was applied. Many developers picked up this bad habit when using generated code to learn CSS. This affliction is described as classitis and is, in some

respects, as bad as using table-based layout because it adds meaningless code to your document.

In the preceding example, each element is identified as being part of a news story by using an individual news-related class name. This has been done to allow news headlines and text to be styled differently from the rest of the page. However, you don’t need all these extra classes to target each individual element. Instead, you can identify the whole block as a news item by wrapping it in a div (code) with a class name of news. You can then target news headlines or text by simply using the cascade.

书籍介绍

本书是CSS设计经典图书升级版，结合CSS近年来的发展，尤其是CSS3和HTML5的特性，对内容进行了全面改写。本书介绍了涉及字体、网页布局、响应式Web设计、表单、动画等方面的实用技巧，并讨论了如何实现稳健、灵活、无障碍访问的Web设计，以及在技术层面如何实现跨浏览器方案和后备方案。本书还介绍了一些鲜为人知的高级技巧，让你的Web设计脱颖而出。