前端开发调试工具非常方便,Firefox下有Firebug,Google Chrome和Safari下有Web inspector。 但是手机上的浏览器调试一直还没有特别好的工具。随着iOS 6的退出,这一现象得到了很大的改变。现在可以通过桌面Safari的Web inspector直接调试,iOS 6上浏览器里的网页内容了,几乎跟调试桌面浏览器里的页面一样快,一样方便。唯一的遗憾是,似乎还只有Mac下的Safari 6支持这个功能,Windows下的Safari版本还不行。也许这也是Apple促销Mac的一个手段吧。 调试iOS 6上浏览器里的页面的具体步骤如下 在iOS 6上的Safari设置里开启Web inspector选项。并把设备通过数据线连接到Mac。 打开Mac上的桌面Safari,在Develop菜单下将会出现连接了的iOS 6设备。选择这个设备下要调试的页面。 在桌面Web inspector上选取Html元素,手机上将高亮显示 当然除了高亮显示,其他修改、查看页面加载过程,调试Javascript等一样也不少 update 一篇很全面的关于如何使用手机模拟器和远程调试手机页面的文章: Testing Mobile: Emulators, Simulators And Remote DebuggingRead More →

less的嵌套 less支持嵌套,而且习惯上使用嵌套时使用缩进。但是嵌套的语法还是使用{},而不是缩进。所以下面的写法是错误的。 .classA { display: block; } .classB { display: none; } //生成的css如下 .classA { display: block; } .classB { display: none; } 正确的写法是 .classA { display: block; .classB { display: none; } } //生成的css如下 .classA { display: block; } .classA .classB { display: none; } 串联选择器 默认情况下less嵌套生成的是后代选择器。如果要生成串联选择器,一定记得要在前面加上&符号。这对伪类尤其有用如 :hover 和Read More →

昨天为了看SlideShare比较清爽些,刚弄了个改变SlideShare ppt缺省大小的Bookmarklet,没想到今天就看到SlideShare在测试更大的ppt画面的新UI设计, bigfoot. 我马上去试了一下,还是不太满意: ppt大小是固定大小(728x562px), 广告位还是很多. 最后我还是bigfoot关掉了,继续使用这个小Bookmarklet.Read More →

SlideShare是个很好的资料网站,那里你总能找到符合你胃口的的ppt. 可惜缺省的ppt大小比较小(598×481),有的时候连字也看不清楚.切换成全屏吧,又太招摇,桌面上的消息也不太容易看到. 如果提供个大一点的ppt选项就好了,这就是下面这段Bookmarklet的由来.把它拖到浏览器的收藏夹,以后你在SlideShare上看ppt的时候,单击一下这个Bookmarklet,就会把广告什么的隐藏掉了,ppt的宽度大概是屏幕宽度的70%. 这是点击前和点击后的展示效果:Read More →

CSS3确实带来了很多很炫的功能,但是为了在现在的浏览器上使用CSS3确实很费劲. 比如要为不同的浏览器书写自己格式的CSS3属性名就是一件麻烦事. 他们为什么不直接使用标准的CSS3属性名呢?! 如果要把元素旋转度,CSS3的语法是: 却要写这么多: 真是够丑的,谁有好办法?Read More →