媒体查询可以根据不同的设备屏幕尺寸，应用不同的样式规则，从而实现响应式布局例如，可以使用 maxwidthminwidthmaxheightminheight 等属性来设置元素的最大最小宽度或高度，以适应不同设备的屏幕尺寸另外；响应式布局只需要一个页面布局就可以完成屏幕适配，其实现工作量相对较小然而，有必要用一套方案来适应所有的屏幕尺寸所以设计时要考虑很多因素 一般来说，自适应布局适合复杂页面，响应式布局适合页面结构简单的页面 因为移动端和PC；视频嵌入，视频对象，视频iframe宽度100%高度自动 最后要注意的是，在页面的顶部pclass=gridcontentbgpurpledarkpelcol elrow 2分栏间隔 通过Row组件的gutter属性来调整布局之间的宽度 1；由于外层是positionrelative，所以里层是absolute的话，则会以外层的左上角为位移参考对齐当然外层只写positionrelative，写上left，top这两个值，则表示以以这个元素的本来应该在的位置为布局参照原点进行left，top对齐；1，方案一响应式来做，可以根据媒体查询，设定在不同屏幕宽度下div的高度和宽度，具体的设置看你响应式想怎么显示 media only screen and minwidth 100px and maxwidth 640px div width 100pxheight。

最近项目使用element ui的响应式布局， 其中elheader与elfooter的高度在不同设备不能自适应调整，于是想手工调整，试了无数个css方法竟然不行注在elheader上有height属性，可以设置高度，本文讲的是用css方法设置；如何在手机上开发页面和webhtml有区别吗两者没有区别在手机上开发网页有很多方法目前html5的发展不够均衡，导致各大浏览器对h5的支持都不尽如人意但是它增加了@media属性它属于css3，这里不严格区分html5和css3；PS，我只是说说，移动端响应式局的话，布局要随着窗口变的，就像你这个，要是在普通的手机端就得变成一栏布局，不能保持三栏 用Media Query设置不同的窗口宽度给不同的css样式 都是css代码不用js控制 html5移动端div的；1选择基本设计尺寸，一般以1080为基准确定响应式网页设计的应用场景后，与美工或设计师沟通之前，美工通常需要制作几套主流移动设备屏幕分辨率的设计图现在，使用streaminglayout和rem，可以使用一套设计图，以最常用的。

响应式布局是Ethan Marcotte在2010年5月份提出的一个概念，简而言之，就是一个网站能够兼容多个终端而不是为每个终端做一个特定的版本这个概念是为解决移动互联网浏览而诞生的响应式布局可以为不同终端的用户提供更加；1图片宽高固定，这种情况很简单水平居中就在图片的css中加dispalyblockmargin0auto垂直居中自己算出p的高度图片的高度2，得到margintop值即可2图片高度未知，这个布局比较难实现一般我是用js做的；ltltspanmeta name=“viewport” content=“width=devicewidth， initialscale=10， minimumscale=05， maximumscale=20， userscalable=yes” 在网页的中增加以上这句话，可以让网页的宽度自动适应手机屏幕的。

后来想着经常听到流式布局，自适应布局，响应式布局，他们有什么区别呢，就去搜了许多内容查看，才发现每种布局都有优缺点和不同使用场景静态布局 给页面元素设置固定的宽度和高度，单位用px，当窗口缩小，会出现滚动条；只要你会5，就可以做响应式布局 如果不用5语言写，那就用普通的4来写，宽高用百分比来表示就行，赵一鸣随笔部落格就是用百分比来表示的，你可以搜寻开启网站看一下 如果我的回答对你有用，可以采纳哦。

响应式布局设计，是指将桌面设备上的网页内容在移动设备上进行优化排版，使用户能够在移动设备上更方便地阅读并操作其实，如果经常使用不同的设备浏览互联网网页，就会比较容易体会响应式布局设计在移动设备上的应用页面的。

针对 IE8 仍然需要额外引入 Respondjs 档案由于仍然利用了浏览器对媒体查询media query的支援，因此还需要做处理这样就禁用了 Bootstrap 对移动装置的响应式支援HTML5中响应式布局怎么弄 步骤1 建立空白的HTML。