CSS发展与演变历史

2 阅读1分钟

css发展历史

css1(1996)

css的出现相对于html要晚一点。你可以把html看作身体,而css看作衣服,javascript看作人的行为。

css1.0重要内容

  1. 字体、颜色、文本对齐
  2. 盒模型基础(外边距、内边距、边框
  3. 简单的选择器(类型、类、ID)

缺陷 缺乏布局能力,以来表格或者框架实现复杂的排版

CSS2(1998-2011)

重要更新

  1. 定位:position 脱离文档流布局
  2. 媒体类型:针对打印、屏幕等设备适配
  3. 表格样式与光标控制

缺陷 浏览器兼容性差异大

CSS3(2011-)

重要更新

  1. 布局更新flex\grid布局
  2. 动画效果:transform@keyframes\
  3. 更精细化样式控制:borderradius\box-shadow的
  4. css变量出现:var()
  5. 媒体查询@media
  6. 属性选择器、伪类、伪元素

特别重要的更新:

  1. 动画:以前动画是通过js实现、现在通过css实现、性能更好,实现更简单
  2. css变量:可以实现简单的css编程,结合变量和动画,可以实现复杂的效果
  3. 媒体查询:实现多端样式切换和共享。

CSS发展趋势(工程化-生态工具链)

  1. Sass\Less预处理,通过预处理编程解决CSS缺失的变量和嵌套等功能
  2. 后处理器:PostCSS通过插件优化代码(如autoprefixer自动添加前缀)
  3. CSS-in-JS: CSS支持JS语言环境中的支持