Hello World

移动端页面常用的一种滚动效果，一般是使用JavaScript，但是也可以使用CSS的scroll-snap来实现。

Scroll Snap

scroll-snap-type: none | [ x | y | block | inline | both ] [ mandatory | proxi......

ESlint

可以给文件添加/* eslint-disable */，或者对某块代码禁用警告

/* eslint-disable */

alert(1);

/* eslint-enable */

/* eslint-disable no-alert, no-console */

alert(......

原文：

展示了Google Web Fonts中一些高质量字体的使用实例，页面里没直接写字体名字，拉出来备注一下

样式

<link href='http://fonts.googleapis.com/css?family=xxxx' rel='......

原文：

作者：

大致思路是用SVG做背景，SVG text做裁切路径。使用SVG而不是用CSS裁剪图像，是因为要实现背景动画的话CSS就需要一个gif的动态图片。

首先需要创建一个由SVG图形组成的背景。这里使用椭圆形斑点的形状。需要注意的是将矢量图软件中的画板/画布大小设置......

CSS-Tricks推送文章里看到的用CSS Grid实现的霍格沃茨黄牛票

See the Pen by Olivia Ng

() on .

CSS Grid网格布局，使用水平和垂直的线相交形成网格，然后将元素放置在他们形成的单元格上。

使用网格布局，需要在容器元素上定义displa......

<i class="fa fa-calendar"></i>

.fa::before {

background-image: linear-gradient(90deg, #51a0fc, #d2a2e6);

background-clip: text......

效果：

See the Pen by NINE () on .

CSS PAINT API

CSS Paint API，是API集合Houdini中的一部分，可以用来绘制图像，并作为需要设置image的css属性的值，比如background-image，border-image。

......