前一段时间State of CSS发起了2022年的调查问卷，该文件的内容主要是CSS新特性、框架、工具库的使用情况，本文章整理一下这个问卷中涉及到的新特性。
实操demo，在H5改样式用到的css属性，展示了使用方法，比如：online 的input用到了 :focus-visible
规范的意义、好处、类别介绍
通过文章可以详细了解前端相关的基建都有哪些，能解决什么问题
Grid 布局是将容器划分成"行"和"列"，产生单元格，然后指定"项目所在"的单元格，可以看作是二维布局，使布局更加灵活
Grid 布局与 Flex 布局有一定的相似性，都可以指定容器内部多个项目的位置。但是，它们也存在重大区别。
Flex 布局是轴线布局，只能指定"项目"针对轴线的位置，可以看作是一维布局。Grid 布局则是将容器划分成"行"和"列"，产生单元格，然后指定"项目所在"的单元格，可以看作是二维布局。Grid 布局远比 Flex 布局强大。
做移动端的 H5 项目的过程中， iphone手机上Safari 底部会被状态栏挡住一部分；这篇文章会给你答案
PostCSS plugin to fix iOS’s bug with 100vh.
Headless UI 是一个组件库设计的新思路，也是未来组件库必然的趋势。对于前端同学而言，学习了解它也显得尤为重要。
通过 Headless UI，我们可以快速复用组件的状态以及交互逻辑，对于布局和样式实现完全自定义。
值得一提的是，在日常开发中，我们也可以尝试借鉴这样的思路，将通用状态逻辑抽离出去，方便复用，帮助我们在日常开发提效。比如：常见的筛选过滤、分页请求列表数据的逻辑等；甚至，我们还可以将业务逻辑同 UI 交互进行抽离，比如：在多端场景（Web PC 端、小程序端、RN 端）下复用同一套业务逻辑代码，实现业务逻辑复用和统一，以此大大提高我们的生产力。
这个周刊每周一发布，同步更新在github、微信公众号。
