CSS 入门与实践

　　本书内容包含浏览器和开发工具介绍，CSS 基础知识和应用方法。通过贯穿全书的应用案例，引导读者了解和学习 CSS 相关的知识点，并利用这些知识分析和解决问题。读者在学习完本书后，应该能够掌握通过 CSS 来控制网页布局及内容呈现的方法，了解到常用的 CSS 技巧，并具备分析和解决 CSS 相关问题的能力

　　胡俊卿，山东科技大学软件工程专业。现任上海万企明道软件有限公司前端工程师，负责 Web 端和移动端部分模块的开发工作。自 2010 年接触前端及相关技术以来，一直从事前端开发相关的工作。参与过 CMS 系统、室内地图、CDN 平台、开发测试平台、社交应用及办公协作平台相关系统的设计和前端开发工作

第1章了解CSS1 

1.1CSS的作用1 

1.2工作机制1 

1.3网页浏览器2 

1.4兼容性问题2第2章开发工具4 

2.1浏览器和开发者工具4 

2.1.1Google Chrome浏览器4 

2.1.2开发者工具5 

2.2代码编辑工具7 

2.2.1Visual Studio Code7 

2.2.2在线编辑和预览工具8 

2.3静态文件服务器8 

2.4代码存储和版本控制——Git9 

2.5参考文档和资料9第3章开始编写CSS11 

3.1CSS规则11 

3.2选择器11 

3.3属性声明13 

3.3.1属性名称13 

3.3.2属性前缀13 

3.3.3属性值14 

3.4@规则15 

3.4.1@charset15 

3.4.2@import15 

3.4.3@media16 

3.5注释17 

3.6错误处理17 

3.6.1无效的值17 

3.6.2使用浏览器解决样式问题18第4章网页中的样式21 

4.1将CSS应用到网页中21 

4.1.1内联样式21 

4.1.2内部样式21 

4.1.3外部样式22 

4.2使用JS控制样式22 

4.3相对路径和绝对路径23 

4.4网页中存在的样式24 

4.4.1浏览器默认样式24 

4.4.2网页开发者定义的样式24 

4.4.3用户自定义样式25 

4.5样式的层叠25 

4.5.1根据来源确定优先级25 

4.5.2根据规则顺序确定优先级26 

4.5.3!important标记26 

4.6样式的继承27第5章选择器28 

5.1基本选择器28 

5.2属性选择器29 

5.3伪类选择器29 

5.3.1a元素专属的几种状态30 

5.3.2:active状态30 

5.3.3:hover状态30 

5.3.4:focus状态30 

5.3.5:enabled状态与:disabled状态30 

5.3.6:checked状态31 

5.3.7:root状态31 

5.3.8子元素位置31 

5.3.9子元素类型32 

5.3.10:not(selector)32 

5.3.11:fullscreen32 

5.4伪元素选择器32 

5.4.1::after33 

5.4.2::before33 

5.4.3::first\|letter33 

5.4.4::firstline33 

5.4.5::selection33 

5.5关系选择器34 

5.6选择器组合34 

5.6.1叠加34 

5.6.2组合35 

5.7选择器优先级35第6章CSS属性值37 

6.1整数37 

6.2数值37 

6.3百分数37 

6.4尺寸值37 

6.5角度值38 

6.6时间38 

6.7字符串39 

6.8关键词39 

6.9颜色值39 

6.10函数41第7章字体和文本42 

7.1本章实例42 

7.2字体相关属性44 

7.2.1fontfamily属性44 

7.2.2fontsize属性45 

7.2.3fontstyle属性46 

7.2.4fontweight属性46 

7.2.5lineheight属性47 

7.2.6font属性47 

7.2.7@fontface声明47 

7.3文本相关属性49 

7.3.1direction属性49 

7.3.2letterspacing属性49 

7.3.3wordspacing属性49 

7.3.4white\|space属性50 

7.3.5wordbreak属性52 

7.3.6textalign属性52 

7.3.7textjustify属性55 

7.3.8textindent属性55 

7.3.9texttransform属性55 

7.3.10textoverflow属性56 

7.3.11wordwrap属性57 

7.3.12userselect属性57 

7.4装饰性样式58 

7.4.1color属性58 

7.4.2textdecoration属性58 

7.4.3textshadow属性59第8章盒模型60 

8.1本章实例——音乐网站主页60 

8.1.1页面框架61 

8.1.2网格布局64 

8.2元素的呈现方式66 

8.3盒子的组成68 

8.4宽度和高度70 

8.5内边距71 

8.6边框71 

8.7外边距75 

8.8尺寸计算78 

8.9内容溢出78第9章弹性盒模型81 

9.1本章实例——弹性多列布局81 

9.2相关概念82 

9.3弹性容器相关属性83 

9.4弹性子元素相关属性88第10章装饰性样式92 

10.1边框背景图92 

10.2轮廓95 

10.3圆角96 

10.4背景99 

10.5渐变104 

10.6盒阴影107 

10.7透明度108第11章定位110 

11.1相关属性110 

11.1.1position属性110 

11.1.2top、bottom、left、right属性112 

11.1.3zindex属性113 

11.2应用场景114 

11.2.1Tooltip组件114 

11.2.2Dropdown组件116 

11.2.3Dialog组件118第12章浮动120 

12.1浮动的特征120 

12.2清除浮动122 

12.3应用场景124第13章变换127 

13.1添加变换效果127 

13.2支持的变换类型129 

13.3设置变换原点130第14章过渡131 

14.1添加过渡效果131 

14.2相关属性132第15章动画134 

15.1动画实例134 

15.2定义动画136 

15.3使用和控制动画137第16章其他属性140 

16.1visibility属性140 

16.2resize属性141 

16.3cursor属性142 

16.4content属性143 

16.5filter属性144 

16.6verticalalign属性146第17章内置元素的样式149 

17.1按钮149 

17.2列表150 

17.3表格153 

17.4表单156