标签：前端开发
共 64 篇文章
CSS 中 margin 与 padding 的百分比
最近做开发的时候用到了多次 margin: xx% 来做自适应的网页布局，但这个东西有时候出来的结果并不是自己所想的，于是去百度了一下这个百分比的计算基准，结果发现了一个比较好玩的点。
示例HTML
<div class="boxer">
<div class="box"></div>
</div>不定宽高元素的水平垂直居中
前端开发中水平垂直居中是绕不开的坎，尤其是宽高不定的元素，之前听说过总总办法，由于自己懒，也没一一去试，今天就做一个总结。
PS：纯CSS实现，布局的问题不应试交给JavaScript(除非某些破不得已的情况)。
预期结果
使用 Less 替换 wxss 开发微信小程序
微信小程序开发中默认使用的 wxss 做为样式文件，这货对应成前端就是 CSS 文件，所以通常写 wxss 文件的时候会很痛苦。因为我已经完全放弃了小程序自带的编辑器（参考：wxapp.vim——使用Vim开发小程序利器），于是尝试在微信小程序开发中引入 Less 来自动编译 wxss。
小程序开发 webview 中无法获取参数的解决方法
小程序开发已经支持 web-view 的跳转，最近开发的一项功能正好APP与小程序均要使用，于是自然想到使用 web-view 的方式。场景是这样的：
用户打开APP/小程序，查看自己个人信息卡片，根据不同的 userid 返回不同的卡片样式。
H5实现
H5实现很简单，直接使用页面类似地址 https://xxx.com/xxx.html?userid=2345。
解决html2canvas的图片跨域问题
最近要做一个将当前HTML页面生成图片的功能，网上百度了一圈，确定了如下的解决方案。
- 使用html2canvas将HTML DOM节点转换成canvas
- 使用canvas的
toDataURL方法将canvas转换成base64
Weex的那些坑
- 750px就相当于100%了，不要问为什么。
- 字体单位用wx，设计图字体大小/2
- 选择器只支持单类名选择器
- background-color写全了
- less/sass/stylus之类的不用想太多，折腾还不如直接写纯css
- text 标签不要留空格，不信你可以试试，老爽了。
使用SVG绘制饼图
年前的时候有个需求，要实现一个动态画大饼的效果。地址：退票潮来袭 捡漏最佳时间到
本来并不想做，都要过年了。结果设计师说他见过很多网页都有这效果应该很简单～咱是前端，人家都做出来的效果，那咱也能。。
继续阅读使用SVG实现动态签名效果
之前看过的svg动画的相关内容，想起了之前在flash中常见的一种动画--动态写文字。语言乏力，大约就是这么个样子：Flash模仿制作毛笔写字效果动画实例教程，所以就想用svg实现这么一个效果。
实现成这个鬼样子：尹全超-签名
继续阅读JavaScript中forEach无法遍历空位
说一个小坑吧。
之前在看《JavaScript高级程序设计》的时候，看到这样一句话：“它只是对数组中的每一项运行传入的函数，这个方法没有返回值，本质上与使用for循环迭代数组一样。”（P97）
继续阅读