2016 年快结束了，最后一天总要留下点什么。
Canvas 实现位图转像素画
C
实现footer在页面底部
实
突然发现自己写的hexo模板有点问题，当页面主体高度不够的时候，footer页脚也跟着往上移，不在整个页面的底部了，很不协调，看着也不舒服。于是问题就来了，如何解决。
在footer使用负的margin-top
思路：将页面主体部分的min-height设为100%，于是页面就可以充满整个浏览器窗口了，footer就不会低于页面高度了，然后footer部分再使用负的margin-top来使footer往上移，这样就刚好置于页面底部。但这时候需要一个空的标签来保持主体部分距离底部的高度等于footer高度，防止文字覆盖在footer上面。
<body>
<div class="content">
主体正文
<div class="fix"></div>
</div>
<footer class="footer">
底栏固定
</footer>
</body>
</body>
程序员与画家
程
移动 webapp 开发相关要点
移
2016-11-15 00:11
如何快速搭建静态资源服务器
如
2016-10-19 21:10
前端开发中，经常遇到有些场景需要用到服务器环境，例如AngularJS中的路由，或者是模拟ajax获取数据等需求时，这个时候并不需要考虑到服务端逻辑，只是搭建简单的静态资源服务，因此解决方法有很多，下面介绍几种简单快捷的常用方式：
使用browser-sync
browser-sync，非常棒的工具，最吸引人的是它的监控和同步功能，体验非常好，可以不用一直f5刷新浏览器即可实时看到修改了的变化。只要在同个局域网，还可以在手机上也同步看到变化，不需要手动刷新，非常适合移动端调试，很推荐使用。
安装：
npm install -g browser-sync
来些CSS技巧
来
积少成多的感觉。
一个很常见的问题，列表横向排列的时候，我们需要给每个列表设置右边距，通常最后一个是不必要设置的，如果网站需要兼容到IE8等不支持
:last-child之类的选择器时，其实可以这样解决：ul列表可以设置宽度长一点，然后给ul的父元素设置overflow:hidden，这样每个li设置margin：right超出也无所谓，就不要再给最后一个li设置右边距为0
用
box-shadow画边框
边框毫无疑问用border来实现就行，如果需要再加一层呢？对的，用box-shadow，box-shadow第四个参数可以让阴影的半径增大或减小，可以将前三个参数设为0，就不会呈现出阴影效果而是边框效果See the Pen GNBLWo by lonica (@lonica) on CodePen.
不过需要注意的是，box-shadow第四个参数长度是从边框外开始计算的，如果是两层box-shadow的话，第二层的值必须大于第一层才能看的到。并且，它不是边框，只是个看起来像边框的阴影。所以相邻的元素会被box-shadow部分遮挡住。
解决MySQL因max_allowed_packet的值设置过小而查询失败的问题
解
2016-10-11 22:10
在MySQL中，Client和Server通信时可接收数据包的大小是受限制的，这个限制值为max_allowed_packet，通信的最小单位就是packet，当Server接收的数据包大小超过了MySQL配置文件中max_allowed_packet的限制值时，对数据库的读写操作则会失败。
那么如何修改这个值的大小。首先，我们可以通过这个命令先查看当前max_allowed_packet值的大小：
SHOW VARIABLES LIKE '%max_allowed_packet%';
解决HTTPS方式下GIT推送到远程分支每次都要重新输入用户名密码
解
2016-10-11 22:10
最近因换了硬盘，重新克隆Git项目到本地，因为使用的是HTTPS方式克隆的，在每次推送代码到Coding上时发现都要输入username和password，除非改成SSH方式，不然很不方便。
经过一番尝试，找到了解决方法：
- 在克隆项目时加上用户名和密码信息，这样以后这个项目的推送就不需要再输用户名密码：
git clone https://username:password@git.coding.net/username/Demo.git
AngularJS 什么时候用$apply
A
写AngularJS代码时会时常发现，有时候明明数据模型更新了但是页面视图层并没有更新，然后只要在代码里加上一句$scope.$apply()，视图就更新了。以前总是不清楚什么时候该用，现在清晰了，记录一下。
其实总结一句就是：DOM监听事件处理程序中的代码，外部的回调函数（例如setTimeout(),setInterval()）中的代码等不在Angular执行上下文中的代码，如果有修改到Angular数据模型时，则必须由我们手动调用$apply()来获得视图层的更新。$apply方法将会调用一个digest循环来更新整个视图层。
理解浏览器同源策略与跨域的解决方案
理
前端 > Javascript
2016-09-28 09:09