随笔分类 - CSS
摘要：前言 写作本文起源于知乎的一个问题:【CSS Grid 布局那么好，为什么至今没有人开发出基于 Grid 布局的前端框架呢？】 这篇文章拖沓了两个月，是因为真的不知道从哪里说好。这个问题的所有回答几乎都没有切中问题的本质，而且对 CSS Grid 也有很深的误解。另外这个问题的描述可能不太恰当，因为
阅读全文
摘要：序言：你是否想过单纯使用 CSS 也可以制作一款游戏？甚至可以双人对决！这是一篇非常有趣的文章，作者详细讲解了使用纯 CSS 制作四子连珠游戏的思路以及使用奇淫巧技解决困难问题的方法。因为案例本身比较复杂，而本人水平有限，翻译必有不恰当之处，欢迎留言评论。 原文： "How the Roman Em
阅读全文
摘要：序言：首先，这是一篇学习 SVG 及 JS 动画不可多得的优秀文章。我非常喜欢 Ana Tudor 写的教程。在她的教程中有大量使用 SVG 制作的图解以及实时交互 DEMO，可以说教程的所有细枝末节都可以成为学习 SVG 以及 JS 画图的资料。另一方面，这篇教程也非常枯燥，因为教程的主要篇幅是关
阅读全文
摘要：Github: https://github.com/nzbin/snack-helper Docs: https://nzbin.github.io/snack-helper 前言 什么是 helper ？任何框架都不是万能的，而业务需求却是多种多样，很多时候我们只需要更改组件的部分属性，而 he
阅读全文
摘要：序言：学习工具的最好的方法就是尝试新技术，本文通过“单元素艺术”介绍了 CSS 变量的使用以及给单元素添加动画的几种方法。通过学习作者编写的复杂的“单元素”示例，相信你对 CSS 变量以及 CSS 动画会有一个深刻的认识。 原文：Animating Single Div Art 翻译：nzbin 如
阅读全文
摘要：Github: https://github.com/nzbin/snack Docs: https://nzbin.github.io/snack 前言 这篇文章我已经酝酿了半年之久，或者说拖沓了这么久吧。想说的东西很多，却又无从说起。如今轻量级框架如雨后春笋，层出不穷。我想每个人都应该归纳总结工
阅读全文
摘要：本文由 叙帝利 翻译，黄利民 校稿。未经许可，禁止转载！ 英文出处：Loops in CSS Preprocessors 发表地址：http://web.jobbole.com/91016/ 如果你看过老的科幻电影，你一定知道循环的强大之处。给你的机器人克星设置无限循环，它就会爆炸，然后机器人灰飞烟
阅读全文
摘要：本文主要介绍了添加下划线样式的几乎所有方法，并且比较了每一种方法的优缺点。没想到之前一直没有注意的下划线还有这么多玄机奥秘！ 本文由 叙帝利 翻译，艾凌风 校稿。未经许可，禁止转载！ 英文出处：css-tricks.com 发表地址：http://web.jobbole.com/89425/ 有很多
阅读全文
摘要：GitHub: https://github.com/nzbin/CardShow/ Demo: https://nzbin.github.io/CardShow/ 前言 这个小项目（卡片秀）是一个卡片抽奖特效插件，用开源项目这样的词语让我多少有些羞愧，毕竟作为一个涉世未深的小伙子，用项目的标准衡量
阅读全文
摘要：首先看一下 MDN 上关于 pointer-events 的介绍： CSS属性 pointer-events 允许作者控制特定的图形元素在何时成为鼠标事件的 target。当未指定该属性时，SVG 内容表现如同 visiblePainted。 除了指定元素不成为鼠标事件的目标，none 值还指示鼠标
阅读全文
摘要：原文：The State of CSS Reflections 译者：nzbin 友情提示：由于演示 demo 的兼容性，推荐火狐浏览。该文章篇幅较长，内容庞杂，有一定难度。而我本人学识有限，加之时间仓促，所翻译内容可能有不恰当及晦涩之处。欢迎大家拍砖指正。 我最近在 codePen 上看到了这个
阅读全文
摘要：原文：fun-times-css-pixel-art 译者：nzbin 友情提示：由于国内网络的原因，CodePen可能会打不开或者非常慢，请耐心等待！ 像素艺术作为一种遗失的艺术形式，与超清晰，高分辨率图片相比黯然失色。我在 CodePen 上浏览时偶然发现了一些像素艺术，它提醒我这种艺术是多么令
阅读全文
摘要：原文：A look into writing future CSS with PostCSS and cssnext 译者：nzbin 像 Twitter，Google，BBC 使用的一样，我打算对 CSS 后处理器 PostCSS 的世界一探究竟。 PostCSS是什么？ PostCSS 是使用
阅读全文
