一个无聊的前端写点无聊的东西

@media的作用：媒体查询可以在指定的设备上使用对应的样式替代原有的样式。 即告诉浏览器，当满足某条件时，就调用该样式。 媒体查询可以用来检测viewport（视窗）的宽度与高度、设备的宽度与高度、横屏还是竖屏以及分辨率。 语法： 1、内联@media @media not|only mediatype and (expressions) {...} 媒体查询由多媒体组成，可以包含一个或多个表...

在日常的网络生活中，我们经常会看到一些土味相册，尤其是父母辈的朋友圈通过各种链接去制作各种花里胡哨的土味相册集，今天我们就利用css3制作一个立方体的土味相册。 制作3D立方体首先需要了解一个在摄影里面的一个重要概念：景深 在摄影中镜头焦距越长景深越浅、反之景深越深。主体越近，景深越浅，主体越远，景深越深。 而在css3中制作3D图形也有这个类似概念，即perspective: 注意：perspe...

在css3的学习中，：checked的选择器虽然只适用于单选按钮或复选框，但是它的用途还是有很多的。 ：checked表示选中的状态。 正常的radio或checkbox的样式效果比较单调，在日常的开发过程中并不能够满足用户的需要,所以自定义效果就及其重要。 利用：checked选择器自定义复选框样式： <div class="box"> <input type="checkb...

Transform字面上就是变形，改变的意思。在CSS3中transform主要包括以下几种：旋转rotate、扭曲skew、缩放scale和移动translate等。 语法：transform: rotate | scale | skew | translate 一、旋转rotate rotate(<angle>) ：通过指定的角度参数对原元素指定一个2D rotation（2D 旋...

在最近阅读美团的源码的时候，我发现了一个新增的单位rem,区别于px,对这个单位进行了一定的研究！ 像素单位px px是Pixel的缩写，就是说像素是指基本原色素及其灰度的基本编码，由 Picture(图像) 和 Element（元素）这两个单词的字母所组成的，如同摄影的相片一样，数码影像也具有连续性的浓淡阶调。 css像素又称为虚拟像素、设备独立像素或者逻辑像素，可以理解为直觉像素。比如iPho...