后端开发教程 - Java、Spring Boot 实战 - msg200.com
100+ 最佳 CSS 学习资源
内容
CSS 参考
CSS 简介
- CSS 简介- 本屏幕录像系列将在大约一小时内教您 CSS 的基础知识。
基本概念
- 级联- 本文解释了什么是级联以及它如何影响您。
- 特异性和继承- 理解特异性和继承对于掌握 CSS 至关重要。本文将有所帮助。
- CSS 盒子模型- 一篇解释网络布局基础的文章。
- 另请查看有关box-sizing属性的详细信息。
CSS 单位
选择器
- 基本 CSS 选择器- 介绍您需要了解的最基本的 CSS 选择器。
- 高级 CSS 选择器- 提升你的知识水平。从属性选择器到 CSS3 伪类。
- CSS 晚餐- 通过这个有趣的小游戏学习如何使用 CSS 选择器。
自定义属性（又名 CSS 变量）
- CSS 变量：为什么要关心？ - CSS 变量的简要介绍。
- 本地范围 CSS 变量：是什么、如何以及为什么- 描述本地范围 CSS 变量的优点。
- 正确使用 CSS 变量- 使用 CSS 变量的模式和反模式。
- 您需要了解的有关 CSS 变量的所有信息- 深入的文章，使用真实示例讲解 CSS 变量的基础知识。
- 使用 CSS 实现反应式- 令人震惊地谈论了 CSS 变量和 JavaScript 中的函数式反应式编程相结合的可能性。
布局
- 学习 CSS 布局- 通过 5 个章节了解 CSS 布局技术。
- Layout Land - Jen Simmons 视频系列，介绍新的 CSS 布局可能性。
- 使用网格和 Flexbox 布局未来- 引入包含 Flexbox、CSS 网格和 Box Alignment Module 的新布局系统。
经典布局
- 浮点数- 有关如何使用（和清除）浮点数的详细信息。
- 定位类型- 仔细了解与 CSS 定位布局方法相关的一些鲜为人知的事情。
- inline-block - 显示在哪些情况下使用显示属性
inline-block进行布局是有意义的。
弹性盒子
- Flexbox 完整指南- 一页包含您需要了解的有关 Flexbox 的所有信息。<!--lint ignore no-dead-urls-->
- Flexbox 游乐场- 在 CodePen 上使用 Flexbox 示例。
- Flexbox Defense - 浏览器中的塔防游戏，让您在乐趣中了解 Flexbox。
- Flexbox Froggy - 通过一个有趣的青蛙和睡莲叶游戏学习 Flexbox 的所有基础知识。
- Flexbugs - 社区精选的 flexbox 问题列表以及跨浏览器解决方法。
- Flexbox Zombies - 一个由故事情节驱动的训练课程，您可以使用 Flexbox 和弩来猎杀僵尸。
- 什么是 Flexbox？ - 一个简单、免费的 20 个视频课程，可帮助您掌握 CSS Flexbox！
网格
- 网格完整指南- 一页纸包含您需要了解的有关 CSS 网格布局的所有信息。
- 网格示例- 除了如何使用网格的示例之外，该网站还有其他有用的学习资源。
- 使用网格进行设计- 讨论 CSS 网格提供的新的布局可能性。
- 网格花园- 可爱的游戏，您可以编写 CSS 代码来种植您的胡萝卜花园。
- GridBugs - 社区精选的 Grid 互操作问题及其解决方法列表。
- Grid Critters - 通过掌握冒险游戏来学习 CSS 网格布局。
动画片
- 初学者的 CSS 过渡和变换- CSS 过渡和 CSS（2D）变换的介绍。
- 您需要了解的有关 CSS Transitions 的所有信息- 还涉及从链接和事件到硬件加速和动画功能的高级主题。
- CSS 3D 变换- 多页教程，包含卡片翻转和旋转木马效果等示例。
- 初学者的 CSS 动画- 传授带有关键帧的 CSS 动画概念。
- animatable - 漂亮的小页面，演示了哪些 CSS 属性是可动画的。
有关的
- Marksheet.io
- Mozilla 开发者网络
- Codrops CSS 参考
- W3学校
- CSS技巧
- 10 个优秀的 CSS 动画资源
- 陈的博客
- 《Smashing Magazine》杂志
- 30秒的CSS
- CSS 参考
- Wes Bos 的 CSS 网格
- Wes Bos 的 CSS Flexbox
- Alligator.IO CSS 页面
- CSS 图像
- 学习 CSS 布局
- 学习 HTML 和 CSS
- 弹性盒青蛙
- CSS网格
- CSS Flexbox - freeCodeCamp
- CSS 网格 - freeCodeCamp
- CSS 测试 - QuirksMode.org
- 弹性盒青蛙
- CSS 餐厅