2017年10月 存档

CSS3 linear-gradient线性渐变实现虚线等简单实用图形

2017年10月27日，星期五

我觉得CSS3 Backgrounds比较厉害的一个地方就是支持多背景，也就是背景图片个数可以无限累加，正好CSS3的gradient渐变性质是background-image，于是，我们可以实现任意数量渐变背景图的叠加效果。甚至，理论上，任意彩色jpg图片都是可以使用CSS3渐变背景实现的。

当然我们实际开发的时候，是不会使用CSS3渐变来模拟一张图片的，更多是用来生成一些简单实用的图形。

本文就将通过实现虚线，三角以及加号减号等案例，展示下CSS3 linear-gradient线性渐变要图形生成技巧。

阅读全文…

标签：, , , , , ,

发布在 CSS相关 | 10 条评论 »

Chrome opacity非1时border-radius圆角边框剪裁问题

2017年10月19日，星期四

border-radius:50%可以让元素正方形元素表现为正圆，如果元素设置了border边框，则会表现为一个正圆圈圈，但有时候，border边框的这个圈圈会在边缘处发生剪裁，不是一个完美的圈圈了，这是如何发生的呢？

阅读全文…

标签：, , , , ,

发布在 CSS相关 | 20 条评论 »

鼠标无限移动 JS API Pointer Lock简介

2017年10月18日，星期三

用一句话说明Pointer Lock API的作用就是：Pointer Lock API可以让你的鼠标无限移动，脱离浏览器窗体的限制！

这对于一些需要鼠标控制的应用非常有用。举个例子：某3D VR女友的游戏，你鼠标向上移动，则你的视角就会往下……

阅读全文…

标签：, , , , , ,

发布在 JS API | 16 条评论 »