引入方式：内联、内嵌、外链、导入link和@import区别：同时加载；前者无兼容性，后者CSS2.1以下浏览器不支持；Link支持使用javascript改变样式，后者不可；

块级元素：divph1h2h3h4formul行内元素：abbrispaninputselectCss盒模型：内容，border,margin，padding

用于声明文档使用那种规范（html/Xhtml）一般为：严格、过度、基于框架的html文档；加入XMl声明可触发，解析方式更改为IE5.5拥有IE5.5的bug；

HTML是一种基本的WEB网页设计语言，XHTML是一个基于XML的置标语言；最主要的不同：XHTML元素必须被正确地嵌套。XHTML元素必须被关闭。XHTML标签名必须用小写字母。XHTML文档必须拥有根元素。

标签闭合、标签小写、不乱嵌套、提高搜索机器人搜索几率；使用外链css和js脚本、结构行为表现的分离、文件下载与页面速度更快；内容能被更多的用户所访问、内容能被更广泛的设备所访问、更少的代码和组件；容易维护、改版方便，不需要变动页面内容；提供打印版本而不需要复制内容、提高网站易用性；

当我提到Grid或Flexbox资源时，我经常看到回复说，如果没有特定的速查表，他们就不能使用Flexbox。我觉得把速查表作为记忆助手查找语法没有问题，我自己也出版过一些速查表。完全依赖速查表的问题是当你复制语法时，你可能会忽略为什么要这样写。然后，当你遇到属性的行为似乎不同的情况时，这种明显的不一致性似乎令人困惑，或者是语言的错误。如果你发现CSS在做一些非常奇怪的事情的情况下，问问为什么。...

CSS转换和动画绝对是我需要知道的基础。我不经常需要使用它们，在使用时会忘记语法。值得庆幸的是，MDN上的参考资料帮助了我，我建议从使用CSS变换和使用CSS动画的指南开始。ZellLiew也有一篇很好的文章，为CSS过渡提供了很好的解释。关于动画可能令人困惑的事情之一是采取哪种方法。除了CSS支持的内容之外，你可能还需要涉及JavaScript，SVG或WebAnimationAPI，而这...

通常，新的Grid和Flexbox布局方法意味着我们可以使用比旧方法更少的媒体查询，因为它们非常灵活，可以响应视口或组件大小的变化，而无需我们更改元素的宽度。但是，有些地方需要添加一些断点来进一步增强设计。字体和排版与布局一样，网络上的字体使用在去年发生了巨大的变化。现在，可变字体，使单个字体文件具有无限的变化。要了解它们是什么以及它们如何工作，请观看MandyMichael的精彩简短演讲：可变...

通常，我会将对齐和布局分开，虽然大多数人把对齐当作Flexbox的一部分。对齐这些属性适用于所有布局方法上，应该在上下文去理解对齐，而不是考虑“Flexbox对齐”或“CSSGrid对齐”。对齐属性在大体上表现一样，但不同布局方式里会有一些差异。在MDN上，您可以深入了解盒对齐及其在Grid，Flexbox，多列和块布局中的实现方式。

十五年来，我们一直使用CSS布局，但没有设计一套布局系统。这已经改变了。我们现在拥有功能完备的布局系统，其中包括Grid和Flexbox，还有多列布局和旧布局方法也应用于实际目的。不要认为grid和flexbox等方法在某种程度上是竞争的。为了更好地使用布局，你有时会发现组件最好作为flex，有时作为Grid。有时，你想要多列流动布局。所有这些都是不错的选择。如果你觉得自己在与某些事...