css圆角+border构建按钮

作者:可乐 发布时间:December 6, 2013 分类:前端 No Comments

back.jpg

SNAKE今天发了这个图,说怎么用CSS来写出效果。顺手写了下。代码如下:

内侧阴影和渐变没有写,如果需要hover可以单独添加上。

因为他的需求是针对手机端,也就是webkit核心的浏览器,所以只针对chrome测试了。其他的只给一个参考的思路而已~

不错的代码片段管理工具Snippets

作者:可乐 发布时间:December 4, 2013 分类:前端 No Comments

本周有个朋友从windows转到mac os下开发。他用习惯了Editplus的代码片段插件,号称离开了就不会写代码的节奏(略蛋疼)。
Sublime Text自带一个snippets的功能,但是是建立在习惯ST的这套机制上。于是乎找到了Snippets这个软件,下载地址http://www.snippetsapp.com/
下面我简单介绍下这个软件。
去上面的地址下载,然后把对应的APP拖到应用程序文件夹内之后运行,就看到如下的界面。

snippets1.png

整体界面比较简单,干净,没有什么乱七八糟的花哨的功能。
我们先创建一个snippet试试看,如下图方式

snippets5.png

这样就创建好了一个片段,那么我们怎么使用他呢? 上图中可以看到一个Copy Code,就可以直接复制当前选中的snippet了,然后到自己的编辑器里粘贴进去就可以了。但是,这样做肯定是比较慢,比较地效率的。那我们怎么办呢?
让我们来看一下软件的设置里关于查找和插入的快捷设置。 使用快捷键 command+, 或者入下图方式打开软件设置

snippets2.png

第一页是设置XML的保存路径,这个对我们来说一般没用,直接进入第二个的设置,快捷键。

snippets3.png

设置好之后,我们打开ST,在里面试试看插入如何。 我们摁下刚才自己设置的组合键,可以看到

snippets8.png

搜索菜单被呼出了,然后搜索自己想搜索的代码片段,比如我们刚才创建的那个。然后这个snippet被选中状态,此时摁下回车

snippets9.png

代码就被顺利的贴到ST里了。 不过,这个软件不只是针对ST的,是所有的编辑器都可以,因为他插入的判断是当前光标所在位置,所以不受编辑器影响。
如果整理好自己常用的代码片段,可以节约大量的时间。
Snippets自带了share功能,但是我尝试了几次,不是特别稳定,尤其是分享到git的那个功能,基本无法使用。
如果希望把自己的snippets分享到网上的同学,可以尝试使用Sublime Text+gist插件+github的方式。

Our Fallen City

作者:可乐 发布时间:November 8, 2013 分类:音乐 No Comments

在豆瓣看电影预告片遇到的一首歌,国内各大网站居然都没有,真心难找啊。所以只能放出audio方式的了,没有豆瓣试听

Riverside

作者:可乐 发布时间:October 10, 2013 分类:音乐 No Comments

当时收藏Agnes Obel也是因为这首riverside,今天听了她的新专辑,相比之下还是喜欢这首riverside