[CSS Grid] Hogwarts ticket

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

See the Pen by Olivia Ng

() on .

CSS Grid网格布局,使用水平和垂直的线......

渐变图标字体

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

.fa::before {

background-image: linear-gradie......

使用JavaScript修改CSS变量

原文地址:

随便看到的顺便记一下,虽然比较短小

这是一段css变量(通常称为自定义属性)

:root {

--mouse-x: 0px;

--mouse-y: 0px;

}

......

重新审视Css Shapes

原文地址:

CSS Shape Level 1规范在Chrome和Safari浏览器上获得支持已经有许多年了,本周(2018/9/4那周)Firefox发布的生产版本Firefox 62中......

使用css grid实现github贡献图

原文地址:

图表分为四个部分

整体图形网格

"days"列

“month”行

图形方格

整体网格

贡献图可以分为三部分 - 星期列,月份行,和独立......

设备物理像素和设备独立像素

几个概念

设备像素,也称为物理像素,是设备能控制显示的最小单位;

CSS像素,写页面样式时候的像素单位,不是实际存在而是抽象的;

设备独立像素,计算机坐标系中的一个点,是可由程序控制使用的虚拟像......