响应式
关注
分享
扫一扫
文章平均质量分 61
郭晓湉
代码小民工
展开
-
响应式布局
相信大家都有一定的了解，响应式布局是今年很流行的一个设计理念，随着移动互联网的盛行，为解决如今各式各样的浏览器分辨率以及不同移动设备的显示效果，设计师提出了响应式布局的设计方案。今天就和大家来讲讲响应式布局这件小事，包含什么是响应式布局、响应式布局的优点和缺点以及响应式布局该怎么设计（通过CSS3 Media Query实现响应布局）。 看页面点击这里一、什么是响应式布局? 响应式布局是Et原创 2015-03-20 10:01:37 · 1937 阅读 · 0 评论 -
移动端注意事项
移动端注意事项移动端，需要注意的比较多，但也方便了前端工作，因为不用考虑兼容。一、手机页面的标准头规范字符编码使用utf-8：指定页面手机内存缓存中的存储时间段device-width：通知浏览器使用设备的宽度作为可视区的宽度initial-scale - 初始的缩放比例minimum-scale - 允许用户缩放到的最小比例maximum-scale - 允许用户缩放到的最大比例为移动原创 2016-06-30 16:33:15 · 970 阅读 · 0 评论 -
用em替换px
过去的几年里，网页设计师使用em替代px主要是为了文字缩放。因为老板本的Internet Explorer无法缩放像素单位的文字。不过现在浏览器很久以前就支持缩放以像素为单位的文字了。那用em替换px还有什么必要性或优越性呢？有亮点显而易见的理由： 一是那些使用IE6的用户也将能够缩放文字; 二是这样做可以使我们设计师和开发者的生活更简单。em的实际大小是相对于其上下文的字体大小而言的。如果我们原创 2016-07-18 10:20:36 · 1937 阅读 · 0 评论 -
弹性图片
在现代浏览器中要实现图片随着流动布局相应缩放非常的简单，只需要在CSS中作如下声明：img{ max-width:100% }这样就可以使图片自动缩放到与其容器100%匹配。更进一步，可以将同样的样式应用到其他标签上。如：img,object,video,embed{ max-width:100% }这样多媒体元素都可以自动缩放了，使用这种方法有几个需要斟酌的问题。第一，要提前准备一张足够大的图片，原创 2016-07-19 11:25:55 · 2078 阅读 · 1 评论 -
响应式设计中的HTML5
响应式设计的“移动优先”思想使它很适宜采纳最简洁、最有效和最具语义的代码。本次内容：HTML5的哪些部分我们现在就能用？如何编写HTML5网页HTML5的精简之道HTML5中的废弃零件HTML5中的全新语义化元素嵌入媒体可响应的HTML5t iFrame视频让网站支持离线使用如何编写HTML5网页打开一个已有的网页。你可能会看到文件开头有这样几行代码：<!DOCTYPE html原创 2016-07-19 11:41:52 · 2852 阅读 · 2 评论