也许你瞧不起以前的 css ，但是你不该再轻视眼下的 css 。近年来 css 的变量系统已逐步得到各大浏览器厂商支持，自定义选择器等强势袭来，嵌套系统/模块系统也在路上...为了更好的掌握 css 这门语言，很有必要把之前零零散散的 css 知识回炉重造下。 css 作为一门…

这些基本概念有些可能不易理解但却都很重要，如果看完还是很不理解的话需要自己谷歌或百度，网上关于这些概念的文章不少。 “流”又叫文档流，是css的一种基本定位和布局机制。流是html的一种抽象概念，暗喻这种排列布局方式好像水流一样自然自动。“流体布局”是html默认的布局机制，如…

编写CSS样式时，其实有很多技巧可以节省HTML元素和让CSS更加的DRY，在这跟大家分享下。 文章将大量举各种示例，让同学们能更加清楚CSS的魅力所在。 文章将持续输出，增加一些新奇的或者唯美的示例。。。 半透明边框相信很多前端小伙伴都经常遇到过，UI设计师也经常性设计出这类…

一个普通的网页，浏览器在渲染前需要先构建 DOM（document object model） 和 CSSOM (css object model） 树。 转换：浏览器从磁盘或网络读取 HTML 的原始字节，并根据文件的指定编码将它们转换成各个字符。 令牌化： 浏览器将字符串转…

本文的主题是 Glitch Art，故障艺术。 什么是故障艺术？我们熟知的抖音的 LOGO 正是故障艺术其中一种表现形式。它有一种魔幻的感觉，看起来具有闪烁、震动的效果，很吸引人眼球。 故障艺术它模拟了画面信号出现故障导致成像错误的感觉。青色色块与红色色块无法重合就是这种故障的…

这段时间写CSS比较多，间接地发现一些与中文有关的CSS特性，在此整理了几点。👀 1. 竖向写作 writing-mode: vertical-lr; 中文在vertical-lr或vertical-rl下每个字符并不会发生旋转，而英文和阿拉伯数字则会把整个字符旋转90度。 …