Media Queries Level 4的几个属性

一般用屏幕大小来判断移动设备,然后为移动端用户更方便的点击页面上的链接或是其他交互类的元素,而设置不同于pc端的样式。但是现在越来越多的小屏设备可以外接键盘和鼠标,对页面元素能比较精确的做点击、输入操......

移动页面字体大小设置

写移动页面的时候,经常会希望在不同分辨率下显示不同大小的字体

calc + vw

情况1: 设置字体大小在不同分辨率下在某个范围内连续变化

例如320px-1000px之间字体大小是16px-......

css :empty 选择器

原文:

通常,我们会要给有内容的容器写样式,但是如何给没有子元素或文字内容的元素设置样式呢?很简单,使用empty选择器

<p> </p><!-- N......

SVG滤镜实现Gooey效果

原文:

作者: Lucas Bebber

一段时间前,Chris写了篇文章,效果很酷,使用的技术也很巧妙,但是这种使用CSS滤镜的方法有几个缺点:不支持透明,不能添加内容,很难适用于黑白......

flexbox

.demo .wrap {

display: flex;

height: 80px;

padding: 5px;

margin-bottom: 10px;

background: #fafcfd;

}......

CSS scroll-snap

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

Scroll Snap

scroll-snap-type: none | [ x......