摘要: 转载请注明原创地址:http://www.cnblogs.com/softlover/archive/2012/11/25/2787559.html 响应式web设计现在已经不是一个难事了,如果你还不熟悉他,可以参看我的文章《HTML5实践 -- 流式响应式设计》。如果你是一个初学者,可能响应式设计对你来说有点发杂,但实际上他比你想象的要简单的多。为了方便你更快的学习响应式设计,我特意写了这个教程,通过简单的三个步骤你就能掌握响应式设计的基本逻辑和media queries(假设你掌握css知识)。 demo预览地址:http://webdesignerwall.com/demo/re... 阅读全文
posted @ 2012-11-29 10:14 下一站永远 阅读(6200) 评论(1) 推荐(2) 编辑
摘要: 转载请注明原文地址:http://www.cnblogs.com/softlover/archive/2012/11/25/2787558.html 当我编码Elemin Theme(我最近设计的一个响应式的站点)的时候,我遇到的一个跳帧就是,如何能让嵌入式的视频在尺寸变化上变得更加灵活。使用max-width:100% 和height:auto可以让html5的video标签很好的工作,但是这个解决方案不适用于iframe 或者 object标签的内嵌代码。通过几小时的寻找资料和实验,我最终找到了解决办法。当你在进行响应式设计的时候,这一css技巧能派上用场。你可以访问最终demo地址... 阅读全文
posted @ 2012-11-29 10:14 下一站永远 阅读(3157) 评论(0) 推荐(0) 编辑
摘要: 转载请注明原创地址:http://www.cnblogs.com/softlover/archive/2012/11/20/2779900.html 大家都知道viewport标签对于响应式设计的意义,但是你们可能不清楚,他对于非响应式设计也有相当的作用。如果你的站点还是非响应式的,那么通过本文你将学会,如何使用viewport标签增强你站点在mobile设备上的显示效果。 Viewport标签的一般使用 Viewport meta标签一般用在响应式设计中,用来设计mobile设备viewport的宽度和initial-scale。<meta name="viewport&qu 阅读全文
posted @ 2012-11-29 09:02 下一站永远 阅读(5324) 评论(0) 推荐(1) 编辑