CSS的发展史
CSS是谁发明者的？
李查理斯的瑞典同僚赖老先生具体来说明确提出CSS
赖老先生生平事迹
生平事迹
1991年获得MIT新闻媒体生物医学听觉研究史学学士学位1994年明确提出CCS基本原理而闻名于世1999年任Opera的CTO2005年他写联名信给谷歌公司问为何IE不全力支持Web国际标准，沙利文说IE 7立刻发布，他写了Acid2用以校正2006年通过了教授毕业考试2006年他首倡Web页面应采用通用型手写体文件格式2007年他首倡应用程序能全力支持video条码看法
谷歌的IE经常成为他的抨击第一类他也是Web列印基本原理的提倡者，用HTML和CSS写书CSS的牛X之处于哪？
CSS得到全名是竹节式样表
竹节指的是什么
式样竹节
能数次对同一个示例展开式样声明示例竹节
能用不同示例对同一个原素展开式样新闻稿文档竹节
能用数个文档展开竹节这些优点使CSS极其灵巧
这也为CSS后来被聊著遗留下了安全隐患CSS的版
版时间重点项目CSS 11996年不必管CSS 21998年加进功能定位，z-index ,mediaCSS 2.12004年~2011年采用最广为的版（IE全力支持）CSS 31999年开始草拟当代版，分组件（IE 8部分全力支持）CSS 4*分组件升级换代我怎么知道什么样应用程序全力支持什么样优点呢？
方式一：数十种应用程序全部跑两遍方式二：caniuse.com为何CSS这么难学？
因为CSS是表演艺术，就像写字，素描，你需要用知性观念来认知CSS 千万别用理智观念，既不要问 为何会这种？ 而要说 原来是这种 应用程序说是好不好，就是好不好
CSS的句法是什么样的？
句法一：式样句法示例 {
特性名： 特性值；
/*注解*/
}
注意事项
所有符号都是英文符号，如果写错了，应用程序会警告区分大小写，a和A是不同的东西没有//注解最后一个分号能省略，但建议千万别省略任何地方写错了，都不会报错，应用程序会直接忽略**句法二: at语法@charset “UTF-8” ;
@import url(2.css);
@media (min-with: 100px) and (max-width: 200px) {
句法一
}
注意事项
@charset必须放在第一行前面两个at句法必须以分号;结尾charset是字符集的意思，但UTF-8是字符编码encoding，这是历史遗留问题如何调试CSS？
方式
采用W3C校正器（在线/命令行工具）采用VSCode看颜色采用WebStorm看颜色采用开发者工具看警告如何采用开发者工具
找到你脑中的条码看它是否有示例看它的式样是否被划掉看它的式样是否有警告Border调试法
步骤怀疑某个原素有问题就给这个原素加borderborder没出现？ 说明示例错了或者句法错了borer出现了？看看边界是否符合预期bug解决了才能把border删掉记住CSS的border调试法就想当于JS的log调试法在哪里查资料？
Google 搜索关键词时加上 MDNCSS tricks（英文）张鑫旭的博客在哪里搜练习素材？
PSD
Freepik搜索PSD web365PSD里的UI套件效果图（不提供下载）
dribble.com 顶级设计师社区能用肉眼模仿它商业网站
直接模仿你常去的网站千万别沉迷于临摹：每个类型的临摹一两个即可 PC网站，手机网站，UI套件
CSS的国际标准制定者是谁？
W3C
搜索CSS spec 能找到CSS最新国际标准，但是没有人能看完它，能去看看CSS 2.1国际标准的中文版CSS文档流
基本基本原理
要认知几个重要的基本原理
文档流Normal Flow块，内联，内联块margin合并两种和模型（border-box 更符合人类观念）文档流
文档流的英文名是Normal Flow ,就是正常的流动方向，指的是文档中原素的流动方向
流动方向
inline原素从左到右，到达最右边才会换行block原素从上到下，每一个都另起一行inline-block 也是从左到右宽度
inline原素宽度为内部inline原素的和，inline原素不能用width指定block原素默认自动计算宽度，能用width指定inline-block结合前两者特点，可用width高度
inline高度由line-height间接确定，跟height无关block高度由内部文档流原素决定，能设置heightinline-block跟block类似，能设置height新的HTML5的国际标准是部分内联原素，和块级原素的，所有的原素都能是内联原素或者块级原素
span原素的宽度是由它内联原素宽度的总和决定的 span原素不能设置宽度
div原素的宽度不是100%，而要auto,能有多宽占多宽 如果div里什么都没有，div的高度是0 永远千万别写宽度为100%
overflow溢出
当内容大于容器
等内容的宽度或高度大于容器的，会溢出可用overflow来设置是否显示滚动条auto是灵巧设置scroll是永远显示hidden是直接隐藏溢出部分visible是直接显示溢出部分overflow能分为overflow-x和overflow-y脱离文档流
回忆
block高度是由内部文档流原素决定的，能设为height这句话的意思是说，有些原素能不在文档流中什么样原素脱离文档流
floatposition: absolute / fixed怎么让原素不脱离文档流
不必上面的特性就不会脱离了盒模型
两种盒模型
分别是
content-box内容盒-内容就是盒子的边界border-box边框盒-边框才是盒子的边界公式
content-box width = 内容宽度border-box width = 内容宽度 + padding + border哪个好用
border-box 好用同时指定padding,width,border就知道为何了什么是盒模型?
CSS盒模型分两种，一种是content-box , 一种是border-box,那content-box和border-box的区别是，content-box的宽度只包含conent，border-box的宽度包含到border , 分别是边框(border) ， 内边距(padding)和内容(content)margin合并
什么样情况会合并
父子margin合并兄弟margin合并上下margin合并左右margin不合并如何阻止合并
父子合并用padding/border挡住父子合并用overflow:hidden挡住父子合并用display:flex,不知道为何兄弟合并是符合预期的兄弟合并能用inline-block消除CSS的特性逐年增多，每年都可能有新的基本单位
长度单位
px 像素em相对于自身font-size的倍数百分数整数remvw和vh颜色
十六进制#FF6600或者#F60RGBA颜色rgb（0,0,0）或者rgba(0,0,0,1)hsl颜色hsl(360,100%,100%) (色相，饱和度，亮度)或者hsla
