2020年03月12日 by 张 鑫旭 阅读 27572 次, 今日 7 次
关于Emoji字体你可能不知道的一些知识，顺便简单介绍了下彩色字体标准之一的OpenType SVG字体的一些知识。
阅读全文…
标签： emoji字体, font-face, font-family, font-feature-settings, font-plattle, OpenType-SVG, Segoe UI, system-ui, unicode-range
发布在 CSS相关 | 4 条评论 »
2020年03月8日 by 张 鑫旭 阅读 51729 次, 今日 10 次
JS ResizeObserver这个全新的API可以用来观察与检测DOM元素尺寸的变化，很多以前不好实现的需求这下有了高性能高质量的解决方案了。
阅读全文…
标签： borderBoxSize, content-box, contentBoxSize, contentRect, DOMRect, javascript, MutationObserver, resize, ResizeObserver, textarea, 数据埋点
发布在 JS API | 9 条评论 »
2020年03月7日 by 张 鑫旭 阅读 52271 次, 今日 11 次
sticky粘性定位规则比较复杂，涉及“流盒”（flow box）和“粘性约束矩形”等概念，如果不搞清楚原理，是无法明白明明设置了粘性定位样式却没有效果的原因的。
阅读全文…
标签： bottom, css相关, flow box, left, position, right, sticky, top, 定位, 流盒, 滚动, 粘性定位, 粘性约束矩形
发布在 CSS相关 | 25 条评论 »
2020年02月27日 by 张 鑫旭 阅读 34965 次, 今日 5 次
关于3D LUT滤镜原理的资料很少，或者原理讲得根本就不清楚，里面的一串数字怎么变成颜色的开发者全然不知，本文就通过真实例子一步一步带你剖析RGB色值是如何通过Cube等滤镜变成另外的颜色的。
阅读全文…
标签： 3D LUT, 3dl, canvas, cube, RGB, 滤镜, 颜色
发布在 JS相关 | 13 条评论 »
2020年02月13日 by 张 鑫旭 阅读 33515 次, 今日 4 次
介绍两种我常用的将CSS媒体查询信息传递给JS的方法，一种是伪元素+content属性发，一种是CSS var自定义属性方法，这样传参有助于降低开发成本，让CSS和JS在一些条件信息上保持一致。
阅读全文…
标签： @media, any-hover, css var, CSS变量, hover, prefers-color-scheme, screen, var
发布在 CSS相关, JS实例 | 18 条评论 »
2020年02月12日 by 张 鑫旭 阅读 17688 次, 今日 8 次
CSS @supports规则现在不仅支持CSS新的属性或者属性值的检测，还支持selector选择器的检测，真是越来越强大了，语法很简单，但是还是有一些需要注意的细节知识。
阅读全文…
标签： :default, :is, :target-within, @supports, nth-child, selector, 选择器
发布在 CSS相关 | 一条评论 »
2020年01月31日 by 张 鑫旭 阅读 30884 次, 今日 11 次
不是流水文档，每一个全局HTML属性都有专门demo页面研究测试其作用，干货和信息量非常大，请预留足够多时间阅读文本，你会学到很多HTML全局新特性。
阅读全文…
标签： ::part, accesskey, autocapitalize, classList, contenteditable, customElements, dataset, direction, draggable, exportparts, inputmode, lang, Shadow DOM, slot, spellcheck
发布在 HTML相关 | 12 条评论 »
2020年01月17日 by 张 鑫旭 阅读 27231 次, 今日 8 次
本文介绍两种把相对路径变成绝对路径的JS方法，都非常简单快捷，还有其他优缺点大家可以根据实际场景选择合适的方法。
阅读全文…
标签： absolute, href, javascript, js相关, link, location, rel, relation, URL, 相对地址, 相对路径, 绝对地址, 绝对路径
发布在 JS实例 | 12 条评论 »
2020年01月17日 by 张 鑫旭 阅读 20534 次, 今日 4 次
大屏的触屏设备访问我们的传统网页的时候，CSS any-hover any-pointer等媒体查询可以极大地提升我们产品的用户体验。
阅读全文…
标签： @media, any-hover, any-pointer, css相关, hover, media queries, pointer, 用户体验
发布在 CSS相关 | 5 条评论 »
2020年01月15日 by 张 鑫旭 阅读 30160 次, 今日 5 次
本文带你深入理解CSS grid-auto-flow各个关键词的作用表现，可以更加明白Grid布局为何会有这样的表现，同时演示grid-auto-flow独有的实用布局场景。
阅读全文…
标签： css相关, float, grid, grid-area, grid-auto-flow, grid-column-start, grid-template, grid-template-areas, grid-template-columns, grid-template-rows, grid布局
发布在 CSS相关 | 12 条评论 »
我的应用
我的应用