变量作为字符动态呈现 CSS var 变量（CSS 自定义属性）很好用，然后，有时候，需要这些变量能够同时作为字符在页面中呈现，我们想到的是使用::before/::after 伪元素配合 content 属性，但是，把 CSS 变量直接作为 content 属性值是没有任何效果的。 借助 CSS 计数器呈现 CSS var 变量值 也就是虽然 content 属性本身不支持变量，但是 counter-reset… »

优先级 如果对所有 CSS 伪类的优先级（也就是我们常说的选择器权重）进行分类，你会发现总共只有两个级别，0 级和 10 级。 0 级指没有优先级，1 级是标签选择器，10 级是类选择器，属性选择器，100 级是 ID 选择器。 伪类，伪类，既然带有“类”字，自然其优先级好类选择器一致。 但是，其中有个特殊，那就是逻辑伪类的优先级都是 0。例如：:not()，:is()，:where()等。 逻辑伪类整个选择器语句的优先级是由括号里面内容决定的，不同的逻辑伪类规则不一样，其中:not… »

实现方式 通常会新建一个另外的独立页面，专门用来接收传入的前端代码，通过新开窗口或者嵌入 iframe 页面的方式达到最终效果，其中可能会用到 HTML5 postMessage 等通信技术。 然而实际上，对于这个预览效果，如果代码是我们自己控制，而不是全权交给用户编辑的，是没有必要新建一个另外的预览页面，亦或者是在新窗口（新标签页）中浏览的。可以直接在当前页面构建一个文档上下文，实现更加方便快捷的预览。 核心原理 需要注意的是，当我们使用 new Blob… »

原生 CSS.supports 语法 返回布尔值 true 或者 false，用来检测是否支持某 CSS 属性。 实际开发的时候，需要使用到对 CSS 检测场景，往往都是针对低版本的 IE 浏览器，例如 IE9-IE11，低版本的 IE 浏览器并不支持浏览器原生支持的 CSS.supports()方法。 JS 赋值再取值的检测方法 当浏览器不支持某个 CSS 属性的时候，就算你强制设置，获取的计算值也不会是你设置的属性值 注意点 getComputedStyle… »

基础 模块 require require 函数用于在当前模块中加载和使用别的模块，传入一个模块名，返回一个模块导出对象。模块名可使用相对路径（以./开头），或者是绝对路径（以/或 C:之类的盘符开头）。另外，模块名中的 .js 扩展名可以省略。以下是一个例子。 另外，可以使用以下方式加载和使用一个 JSON 文件。 exports exports 对象是当前模块的导出对象，用于导出模块公有方法和属性。别的模块通过 require 函数使用当前模块时得到的就是当前模块的 exports… »