概要 由于公司的业务需求,本想年底偷个懒,但是开发小程序的任务袭来。 第一次开发这玩意,记录一些需要注意的点,以后再次开发时可以快速解决。 如果你是新手,推荐你先看官方文档,如果你在开发小程序过程中遇到一些不懂的地方,可…
标签:css3
【前端Talkking】CSS系列-css3之box-shadow介绍
1.写在前面 在CSS3中,可以使用box-shadow属性来创建阴影效果来给二维平面增加深度效果,这个属性在前端开发中使用的非常多,例如segmentfault的首页就是使用了box-shadow属性来增加深度效果,今…
移动端1px边框解决方案
.border-1px { position: relative; } .border-1px:after { position: absolute; content: ''; top: -50%; bottom: -5…
基于JS快速生成各种网格布局工具Grid介绍
作者:云荒杯倾 写在前面 这两天了解了一下css的grid布局,发现确实很好用。看了几篇博客,了解了它的几个常用属性后,可以快速生成一个网格布局。相较于传统的float、定位等显得更成体系,更规范,不需要一些hack做法…
如何绘制一个圆圆的loading圈
如何绘制一个圆圆的loading圈 小程序里需要一个像下面的loading,原生的没有,引入别的组件库又太大,所有决定自己写个。 1.基本原理 动态的实现原理是给8个小圆圈设置透明度由大变小的动画,每个圆圈设置不同的动画…
css background-size与背景图片填满div
background-size与背景图片填满div 在开发中,常有需要将一张图片作为一个div的背景图片充满div的需求 background-size的取值及解释 background-size共有三种属性,分别为 b…
今天搞一搞box-sizing?
讲到box-sizing,首先你要知道什么是css的盒子模型!盒子模型有两种分别是IE的border-box和w3c的content-box. 看了图可能你就已经明白了,不过还要继续,简单来说: 标准 w3c 盒子模型的…
简解Css3 - linear-gradient
简解Css3 – linear-gradient 概念 CSS linear-gradient() 函数创建一个表示颜色线性渐变的 <image> 。 简单的说,元素只要用了linear-grad…
嘿~ 是时候学学栅格布局GRID了 概念篇
下一篇 grid 布局入门 Grid,真的布局神器。Css在引入Flex布局和Grid布局两个模块后,才真正有了布局的概念。最初的table布局不知道是神马鬼,再到 float 满天飞,可能还要使用abosulte来实现…
手写CSS3动画的几种流派
阳春三月,人好,物好,心情好. 差不多也是get新技能的时期. 作为一名能力者,我们将目标锁定到了css3 animation中. 众所周知, 自从css3 加入了 3d硬件加速 就变的叼的一b 动画执行线程单独独立执行…
css3文字颜色动态渐变
浏览 Animate.css官网 的时候发现Animate.css这几个字母的颜色会慢慢变化,个人觉得还是很有意思,本以为是利用animate 改变color,结果F12后发现好多奇怪的css属性。 先来看看我的实现方法…
SegmentFault 技术周刊 Vol.38 - 神奇的 CSS
CSS 的全称是 Cascading Style Sheets,即层叠样式表, 是一种样式表语言,用来描述 HTML 或 XML(包括如 SVG、XHTML 之类的 XML 分支语言)元素所呈现的样式。 “层叠”即表示允…