在学习Canvas组合图形时看描述有些云里雾里,于是记录下实际效果来方便查看:
……继续阅读 »
Alan
2年前 (2016-10-10) 63浏览 0评论
0个赞
如何实现响应式布局?
CSS 3 Media Query(最简单)
原生Javascript(成本高,不推荐使用)
第三方开源框架(可以很好的支持浏览器响应式布局的设计)
Media常见属性:
device-width, device-height 屏幕宽高
width, height 渲染窗口宽高
o……继续阅读 »
Alan
3年前 (2015-09-20) 40浏览 0评论
0个赞
Sublime Text 常用快捷键
快捷键组合
功能
shift + cmd + p
打开命令面板
control + `
控制台
cmd + n
新建标签
cmd + 数字
标签切换
cmd + option + 2
分成两屏
control + 数字
分屏时移动到不同的屏幕
cmd + delelte
删除光标前所……继续阅读 »
Alan
4年前 (2015-08-08) 50浏览 0评论
0个赞
原始尺寸表格效果
代码主要运用到了@media来判断调用的样式,伪元素:before,:after来匹配相关内容,以及用content: attr(data-label)来获取自定属性中的值,缩放及手机效果,
……继续阅读 »
Alan
4年前 (2015-07-15) 83浏览 0评论
0个赞
全文转载一下这篇Econsultancy上的有关2015年网页设计趋势的文章,留待周末拜读
Please do not mistake me for some kind digital prognosticator, soothsayer guru, evangelist, swami, samurai or whatever risible term i……继续阅读 »
Alan
4年前 (2014-12-18) 31浏览 0评论
0个赞
HTML5和CSS3已经被谈论很久了,关于W3C等既得利益体的争论这里按下不表,下面通过简单的CSS3代码来实现一个酷炫的照片墙效果,可以用于制作家庭的生活照相册,也可以在追女孩子时适时小秀一把:)
整个代码中用到的主要有CSS3中的transform中的旋转(rotate),过渡(transition),阴影(box-shadow),同时通过positio……继续阅读 »
Alan
4年前 (2014-11-16) 39浏览 0评论
0个赞
电商网站中会经常出现图片的放大效果,在产品页面尤为常见,如淘宝、京东、一号店等网站都会采用悬浮鼠标在右侧出现图片放大效果。
要实现这种效果可能过JS或jQuery等代码来实现,示例效果如下(通过将鼠标悬浮在下面的图片上进行查看):
首先通过getElementById或其它方法来获取各个对象,然后通过onmouseover和onmouseout事件来显示和……继续阅读 »
Alan
5年前 (2014-09-13) 47浏览 0评论
0个赞
Firebug是网页浏览器Firefox下的一款开发类插件,集HTML查看和编辑、JavaScript控制台、网络状况监视器于一体,是开发JavaScript、CSS、HTML和Ajax的得力助手。在日常使用中常会同时安装其扩展Yslow来一并对网站进行调试。同时为了兼容其它浏览器,还开发有Firebug Lite,功能略弱于Firebug。 安装完后要开启……继续阅读 »
Alan
5年前 (2014-08-17) 44浏览 0评论
0个赞
Html5配合CSS3已经越来越强大,以下通过CSS3+HTML5来模拟活塞运动。
首先设置背景颜色,这里仅测试了IE,Firefox和Chrome较新的版本,使用webkit也是为了兼容Chrome考虑:
background: -webkit-linear-gradient(top, coral, tomato);
background: linea……继续阅读 »
Alan
5年前 (2014-07-31) 48浏览 0评论
0个赞
桌球(又称台球 ,撞球)源自英国,是一项在国际上广泛流行的高雅的室内体育运动,是一种用球杆在台上击球,依靠计算得分确定比赛胜负的室内娱乐体育项目。
下图为通过HTML5的Canvas配合JS生成的仿桌球图片,右侧的小球采用随机函数显示不同颜色,每次刷新后将显示不同的组合颜色。
Your browser does not support the ca……继续阅读 »
Alan
5年前 (2014-05-25) 54浏览 0评论
0个赞