‘壹’ 什么是响应式web设计
响应式Web设计是在开发和设计网站过程中产生的一种方式，它的目的是让内容布局能随用户使用显示器的不同而变化。再明确点说，这种设计概念，就是让原本1292像素宽，4栏的内容，能够很好地显示在1025像素宽的用户屏幕上，同时还能自动简化成2栏。当然，让它很好的适应智能手机和其他种类电脑的屏幕也就成了水到渠成的事了。这种特殊的设计形式就被成为“响应式Web设计”。
响应式Web设计的优点：可以兼容所有尺寸的屏幕，随着手持设备（手机）屏幕尺寸繁多，也有很好的兼容性；而且开发一次，pc版和触屏版，手机版融合为一；
响应式Web设计的缺点：对前端工程师要求比较高，它的屏幕兼容要求前端工程师对各种浏览器差异性了解比较多，对于大数据展示的门户站点，如果用同一页面，即时浏览器不崩溃，在手机上一个页面，很难滑到最底部，带来操作是十分不方便的，触屏版和手机版对优质信息展示不足。
综合优缺点：响应式Web设计在企业站点，微型或者小站还是可以用的，对于大中型站点不合适（尤其大信息量展示的）。
‘贰’ 做响应式web 页面怎么设计
响应式Web设计的方法
介绍完响应式Web的背景和概念之后，是时候该介绍具体的实现方法了，其实响应式Web设计的方法很简单，就是利用CSS3的媒体查询Media Queries和Viewport来解决问题的。
首先我们一起来看看Media Queries，这里我只会对其做一个简单的列举介绍。
通过媒体查询的设置，我们可以根据屏幕宽度、屏幕方向等各个属性来加载不同场景下不同的CSS文件来渲染页面的视觉风格。具体的使用方法有以下两种：
1、通过link标签：
<link rel="stylesheet" type="text/css" media="screen and (max-width: 479px)" href="testcssbywidth1.css" />
示例代码代表当当前屏幕宽度小于479px的时候，加载testcssbywidth1.css文件来渲染页面。
2、CSS中直接设置：
@media screen and (max-width:479px) {
/* 具体的CSS属性设置 */
}
对于Media Queries的一些常用属性，只对常用的几个做一个简单列举说明，其他的属性请各位自行查阅相关资料：
width：描述终端设备显示区域的宽度，接受max/min的前缀；
height：描述终端设备显示区域的高度，接受max/min的前缀；
device-width：描述终端设备屏幕的宽度，接受max/min的前缀；
device-height：描述终端设备屏幕的高度，接受max/min的前缀；
orientation：描述终端设备处于横屏还是竖屏的状态，取值分别为：landscape/portrait。
当我们调整浏览器大小的时候，上面通过媒体查询属性的操作就可以完成响应式Web设计的工作，但是这却不能满足移动终端的浏览器，因为移动浏览器默认页面是为宽屏幕设计的，所以会把他缩小来适应小屏幕，但是终端设备却无法识别正确的宽度，所以光靠媒体查询是解决不了移动终端设备的响应式Web设计的
‘叁’ 响应式web设计在跨终端广告创意中有哪些应用
广告可以分为很多种，有媒体广告（比如说电视，收音）、平面广告立体模型广告...平面广告又可分为很多种如POP、宣传单张、画册、海报、书籍封面、VI等等。所以说主要因素也是各不相同的，共同的因素有文案、构图、广告语、版式、美学感觉、广告音乐、印刷或制作效果、创意...它们相辅相成，表现得可各有千秋，从而达到独创性，而脱颖而出产生具有响力的作品让观众和消费者留下深刻的印象，从面达到宣传推广的作用。
‘肆’ 响应式Web设计的概念，应该怎样做响应式Web设计
前言 现在使用移动设备人越来越多，移动版的Website随之也越来越重要；但是移动端设备的大小不一，屏幕分辨率各不相同，我们不可能为 BlackBerry，iPhone， iPad等等每个都做单独的页面设计。所以我们需要的Website设计要能迎合多种device的要求并且兼容所有的屏幕分辨率，这种设计就叫响应式 Web设计 什么是响应式Web设计（Responsive Web design）？ 响应式Web设计是一种Web设计和开发能够根据屏幕大小、平台和方向对用户的行为和环境做出响应的设计。它包括了灵活的网格和布局，图像和智能使用CSS的media queries特性。当用户从Laptop切换到iPad上时，该网站应能自动地切换CSS规则以适应Device分辨率，图像尺寸和脚本执行。换句话说，响应式Web设计是具备能够自动响应用户喜好的技术。这将一劳永逸的满足对每个新上市的移动终端都要进行不同设计和开发的需求。 需要注意的是：响应式Web设计不仅仅是 下图列出了一些最常见的： 所以，如果你要使你的客户满意，你必须让你的网站能够自动调整并适合上述设备的屏幕。例如，你应该为不同的设备定制不同的布局结构： 定制布局 同样，有些时候，根据需要显示或隐藏一些内容： 显示或隐藏内容 很明显，我们不能为每一种设备定制一个页面。所以，我们应该如何处理这种情况呢？
‘伍’ 响应式Web设计 如何让网站兼容不同需求
使用媒体查询 /* 小屏幕（平板，大于等于 768px） */@media (min-width: @screen-sm-min) { ... } /* 中等屏幕（桌面显示器，大于等于 992px） */@media (min-width: @screen-md-min) { ... } /* 大屏幕（大桌面显示器，大于等于 1200px） */@media (min-width: @screen-lg-min) { ... }
‘陆’ 列举响应式web设计需要应用哪些技术
响应式Web设计（Responsive Web design）的理念是：页面的设计与开发应当根据用户行为以及设备环境（系统平台、屏幕尺寸、屏幕定向等）进行相应的响应和调整。具体的实践方式由多方面组成，包括弹性网格和布局、图片、CSS media query的使用等。无论用户正在使用笔记本还是iPad，我们的页面都应该能够自动切换分辨率、图片尺寸及相关脚本功能等，以适应不同设备；换句话说，页面应该有能力去自动响应用户的设备环境。响应式网页设计就是一个网站能够兼容多个终端——而不是为每个终端做一个特定的版本。这样，我们就可以不必为不断到来的新设备做专门的版本设计和开发了。
‘柒’ 响应式web设计二：什么是网格视图
网格视图是更进一步检查细节的最佳模式
除了美观及吸引人外，网格视图可以帮助用户更进一步检查细节，例如，如果一个用户想要购买一件衬衫，在他们的意识里将有一种已知的类型，只有在用户将内容定位到一个类别时，网格视图才是最有效的。
一个满是衣服的网格视图对于注意力的分散胜过帮助，因为只有少数的这些将是衬衫的图片，用户在浏览时必须通过滚动过滤掉很多不相关的图片。
但一旦用户在位于他们想要的衬衫类别中，图片将有更多相关性，他们可以更轻松的查找、浏览甚至衬衫的某些细节。
‘捌’ 介绍响应式web设计的优势有哪些
1、对用户友好；响应式设计可以向用户提供友好的Web界面
2、移动频段(Mobile Segment) 在响应式网站的帮助下，你可以获得网站流量的全景图。
3、积累分享；响应式Web设计可以让你(作为网站的拥有者)通过单一的URL地址收集所有的社交分享链接。
4、最佳化搜索引擎；搜索引擎也在变得越来越聪明，它们足够智能可以完成移动网站和桌面网站的连接。
5、无重定向；响应式Web设计最大的优点之一是，你不必在乎任何重定向，它包含无用户代理定向。
6、更少维护；开发一个独立的移动网站，会增加你的工作负担。实际上你就拥有了两个独立网站。如果你有一个响应式网站，维护的成本将会很小，因为它只有一个布局，且可工作在所有类型的设备上，而这可以明显地减少你的工作量。