object-fit: contain; 其他属性 object-fit: fill; object-fit: contain; object-fit: cover; object-fit: none; object-fit: scale-down; fill: 中文解析“填充”。默认值。替换内容拉伸填满整个contentbox,不保证保持原有的比…

本文将介绍 CSS 中一个非常有意思的属性 mask 。 顾名思义，mask 译为遮罩。在 CSS 中，mask 属性允许使用者通过遮罩或者裁切特定区域的图片的方式来隐藏一个元素的部分或者全部可见区域。 其实 mask 的出现已经有一段时间了，只是没有特别多实用的场景，在实战中使用的非常少，本文将罗列一些使用 mask 创造出来的有意思的场景。 语…

引言 在web应用中，前端同学在实现动画效果时往往常用的几种方案： css3 transition / animation - 实现过渡动画 setInterval / setTimeout - 通过设置一个间隔时间来不断的改变图像的位置 requestAnimationFrame - 通过一个回调函数来改变图像位置，由系统来决定这个回调函数的执行…

-webkit-font-smoothing字体抗锯齿渲染 下面这段代码是在学习 vue 的时候，启动项目时无意间看到根元素的样式属性，对 其中的-webkit-font-smoothing 的属性不太了解，百度了一番这里记录一下。 #app { font-family: 'Avenir', Helvetica, Arial, sa…

【国务院发布公告：2020年4月4日举行全国性哀悼活动】为表达全国各族人民对抗击新冠肺炎疫情斗争牺牲烈士和逝世同胞的深切哀悼，国务院今天发布公告，决定2020年4月4日举行全国性哀悼活动。在此期间，全国和驻外使领馆下半旗志哀，全国停止公共娱乐活动。4月4日10时起，全国人民默哀3分钟，汽车、火车、舰船鸣笛，防空警报鸣响。 如何将网站风格改为黑白色，…

经常忘记参数的顺序及含义，做个总结方便日后查看 语法结构(简写) animation: name duration timing-function delay iteration-count direction fill-mode; 举例： .dom { animation: wang 3s linear 1s infinite alternate…

透明文字，模糊文字，镂空文字，渐变文字，图片背景文字，用 CSS 让你的文字也有 freestyle～ 前言 我们做页面涉及字体的时候，最多就是换个 color 换个 font-family，总是觉得没体现出你内心的文艺范，这时是不是抱怨 CSS 并没有给文字设置什么样式，抱怨是没用哒，我们自己动手，看看能不能“创造”出一些 CSS 字体样式呢～ …