这个圆圈是用border-radius: 50%画出来的，所以width/height变大的时候，圆圈的半径就会变大，但是在变化的过程中变形了。如果改成用padding做动画，效果也一样，那怎么办呢？一个方法是把动画时间调小一点，这样看起来会减轻，但终究不是根本解决办法。 我在…

CSS Sprites通常被称为css精灵图，在国内也被意译为css图片整合和css贴图定位，也有人称他为雪碧图。就是将导航的背景图，按钮的背景图等有规则的合并成一张背景图，即多张图合并为一张整图，然后再利用background-position进行背景图定位的一种技术。 二、…

est 是一个基于 Less 的样式工具库，帮助您更轻松地书写 Less 代码。

简单易懂的 H5 活动页之移动端 REM 布局适配实操方法介绍

1. 甜嘴棒棒糖 box-shadow的扩张半径参数。 如果只用来当作图片显示，那么再加上适当的外边距，显然已经大功告成了。 但其实会有一个潜在的问题。 因为用box-shadow生成的边框是出现在元素外圈的，而元素的外圈，是不会响应鼠标事件的。 可以通过把每个box-shad…

最近开始上手一些前端的项目，最难受的就是CSS的各种定位，把其中遇到的一些问题记录下来，方便自己查阅，也希望能帮到像我一样的CSS初学者。 运行一下会发现，实际上，hehe这个div贴着haah的div，而不是我们想要的贴到底部。仔细查阅了w3c的文档，其实是由于对于top,l…

图标作为网页设计中的一部分，其在凸显网页重要元素特性，视觉交互、引导以及网页装饰等充当的角色作用举足轻重。由于图标普遍具有尺寸小的特点，在项目实践时不宜将每个图标作为单个图片元素进行加载，这会增加Http请求，影响网页的性能。因此，在实际中，我们可能见到以下一些常见的解决方案：…

一般在响应式中，我们会要求视频的宽高比为16：9或4：3，当用户改变浏览器宽度的时候（改变高度不考虑），视频的宽度变了，那么高度也得根据我们要求的16：9或4：3改变。本文提出了一般的解决思路，并发散性的提出了几个解决方案。

在月初的时候，发了CSS3热身实战--过渡与动画（实现炫酷下拉，手风琴，无缝滚动）。js的代码库也发过两次，两篇文章。之前也写了css3的热身实战，既然热身完了，是时候开始封装css3的代码库了，相比起js的代码库，css3的代码库的逻辑性就更加简单了！可以说只要打上注释和一张…