blog
blog copied to clipboard
anjia
博客，积累与沉淀
CSS 是一门语言，描述 HTML、XML 等 structured documents 在 screen, paper 等媒介上的 rendering。 ## CSS Display Module Level 3 https://drafts.csswg.org/css-display 这个模块描述了： - 如何从 document element tree 生成 CSS formatting box tree -...
## Houdini 的相关模块及各自进展 - [CSS Houdini 的九个API](https://drafts.css-houdini.org/) - 该网页是 Houdini 早期时的状态，只是个草案清单。不完整，有些也只是先占个坑 - 它里面的规范链接有些已经过时了。规范的最新链接，见下表格中的 - “成熟度”列的说明 - 只有 `FPWD` `WD` `CR` `REC` 等，才是官方规范 - 其余的 Draft, Idea 等，说明该 API 目前尚不成熟，先占个坑供大家讨论。即初期阶段 |...
CSS 规范
## 理解 CSS 规范 要理解 CSS specifications，需要理解规范构建的 context, vocabulary 和 fundamental concepts。 1. 每个规范都有它的上下文，可以读 CSS Snapshot, 以及 CSS Design Principles - CSS Snapshot 2017 https://www.w3.org/TR/CSS/#css - CSS Snapshot 2017/2018 2....
W3C 通过 status code 来表示 specifications 的 maturity。 CSS WG 使用以下状态码，从 least 到 most stable： - `ED` Editors' Draft 编辑草案（不是 W3C Technical Report） - `FPWD` First Public Working Draft 首个公开工作草案...
## CSS WG *florian* ... but what we need to worry about is its effects on users, rather than on the mood of developers. *dbaron*: Have to think about what...
CSS WG
Schedule 见 [TPAC 2018 / CSS WG](https://github.com/anjia/blog/issues/22#issuecomment-428843560) ## Proposed Agenda 1. [csswg-drafts](https://github.com/w3c/csswg-drafts) 有 4+n 个 Issues - Initial Letter Layout 和 other Inline Layout 相关的 - 3118, [css-text-decor-4] Rethinking text-underline-offset,...
## 简介 [CSS Layout API](https://www.w3.org/TR/css-layout-api-1/) 能让网页开发人员写自己的布局算法。它是 CSS Houdini #23 的一部分 这样，我们在 CSS 里写`display`属性值的时候，就不局限于浏览器已经支持的那几种布局了，诸如`display: block`、`display: flex`等，我们可以写`display: layout(myLayout)` Layout API 里的所有内容都在 [Logical Coordinate System](https://drafts.csswg.org/css-writing-modes-3/#text-flow)（逻辑坐标系统）里计算。这样的话，网站的书写模式就可以自动影响到你写的布局了。 对于熟悉文本从左到右书写的开发人员来说，Logical Coordinate System 到我们日常用到的名词的对应关系如下： Logical | 在CSS里写的 ---------------|---------...
## 简介 我们都知道，CSSOM 是 CSS 的对象模型，它提供了一系列方法来访问元素上各个属性的值。 [CSS Typed OM](https://www.w3.org/TR/css-typed-om-1/)（CSS 类型化的对象模型），单纯看名字，它只比 CSSOM 多了个 Typed。它是 CSS 的 object-based API，把 CSS value 的字符串值转成了 JS 对象。是 CSS Houdini #23 的一部分。 CSS OM | CSS...
## 简介 [CSS Animation Worklet API](https://wicg.github.io/animation-worklet/) 是 CSS Houdini 的一部分。关于 Houdini 的介绍，可查看 #23。 这个 API 扩展了 Web 动画堆栈。具体来说： - 它扩展了 timelines，让网页开发人员能编排动画效果 - 当然，这点没有什么特别惊艳的，因为我们已经有类似的技术了 - 比如 [CSS transition](https://developer.mozilla.org/en-US/docs/Web/CSS/transition)、[CSS animation](https://developer.mozilla.org/en-US/docs/Web/CSS/animation)、[requestAnimationFrame](https://developer.mozilla.org/en-US/docs/Web/API/window/requestAnimationFrame)、[Web Animations API](https://www.w3.org/TR/web-animations-1/)...