摘要：
页面中使用动效图 一般让设计出一个gif格式的图，但是git图效果都很差，有一个替代gif图做动效的方法：使用@keyframes 具体思路： 1、设计两个互斥的图片（相当于把gif图分割成一帧一帧的图片，这里用两帧为例子） 2、把两个图片放在同一个位置上，重叠 3、使用css改变图片的透明度，实现 阅读全文
摘要：
//npm install gulp -g (global环境) //npm install gulp --save-dev (项目环境) //在项目中install需要的gulp插件，一般只压缩的话需要 //npm install gulp-minify-css gulp-concat gulp-uglify gulp-rename del --save-dev //以下require需要的m... 阅读全文
摘要：
由于原生的checkbox和radio的样式太简陋了，在设计页面的时候，设计师往往会设计自己的checkbox和radio样式。一半情况下，为了适应各个浏览器的兼容性，我们都会用其他的元素替代原生的checkbox和radio，然后用js实现选中和未选中时候的样式，用来模拟checkbox和radi 阅读全文
摘要：
通常我们前端不同页面之间传参数用得最多的方法就是get方法：在url后面加上参数。例如：www.test.com?id=1&name=hello。 英文和字母很好处理，但是如果有的参数值为中文呢？ www.test.com?type='家具' > type=%E5%AE%B6%E5%85%B7，需要 阅读全文
摘要：
一般我们设计的上传按钮都是和整个页面风格相似的样式，不会使用html原生态的上传按钮，但是怎么既自定义自己的样式，又能使用file控件功能呢？思路是这样的：1.定义一个相对定位的DIV，按照整成步骤实现自己的结构和样式；2.在DIV里添加3.将file控件绝对定位，宽度和高度全部覆盖掉父元素，并且设... 阅读全文
摘要：
"混合模式"：Photoshop提供了各式各样的混合模式，但是CSS3阴影只支持正常模式（normal）。"颜色（color）"：阴影颜色。对应于CSS3阴影中的color值。"不透明度（opacity）"：阴影的不透明度。对应于CSS3阴影的颜色rgba()中的a值。"角度（Angle）"：投影的... 阅读全文
摘要：
CSS： //一般的高级浏览器都支持 background: rgba(255,255,255,0.1); //IE8下 filter:progid:DXImageTransform.Microsoft.gradient(startColors... 阅读全文
摘要：
在移动端使用原生的下拉列表（select）会有自带的样式，想要做到自定义样式怎么办呢？首先第一步会去掉默认样式：-webkit-appearance:none;这些对input下的各类型属性，如：type="date"，会去掉默认样式，但是这时候对select设置的边框，宽度或者是文字居中显示等等样... 阅读全文
摘要：
制作二级菜单要实现鼠标移动上去显示子菜单，鼠标移出子菜单隐藏，或者其他类似需求的地方，首先我会想到用jquery的hover事件来实现，如：$(".nav").hover(function(){ $("sub-nav").addClass("show");},function(){ $(... 阅读全文
摘要：
通常做注册页面时会有获取验证码按钮，然后点击后过60秒才能重新获取，比如现在项目中遇到的然后点击后的样式，并且数字是递减的，到0时重新回到最初的状态（上图）。首先构造HTML结构获取验证码css就略了JS实现：var wait=60; function time(o){ ... 阅读全文