自适应布局：不同终端上显示的文字，图片，等位置排版都是一样的，只是大小不同。

响应式布局：通过媒体查询监听屏幕大小的变化，做出响应式的改变，在不同设备可能展现不同的样式效果。

em:是相对其父元素的。

rem:相对于页面根元素，推荐使用rem。

自适应和响应式布局的区别，em与rem的更多相关文章

  1. bootstrap 自适应和响应式布局的区别

    自适应:  不管屏幕多大,都尽量不换行,而只是横向缩放. 响应式: 屏幕变小了之后,属于同一行的元素受到挤压后,行的右边元素自动换行显式: 屏幕大了后,本属于同一行的元素尽可能的排在同一行内: boo ...

  2. 【技术分享会】 @第三期 CSS框架 PRUE 实现自适应和响应式

    Pure网址:https://purecss.cn/ 什么是响应式和自适应? .响应式:样式会随着屏幕大小改变,同一页面设备不同样式不同 .自适应:不管屏幕大小,页面的样式比例不变 响应式和自适应怎么 ...

  3. 彻底弄懂响应式设计中的em和rem

    前一阵子在响应式开发中遇到了em和rem的问题,也上网搜过一些文章,篇幅很长,也没有仔细看,今天来总结一下. rem是指:根元素(root element,html)的字体大小, em是指:父元素的字 ...

  4. 自适应布局，响应式布局以及rem,em区别

    一.自适应和响应式 先说共同点: 两者都是因为越来越多的 移动设备( mobile, tablet device )加入到互联网中来而出现的为移动设备提供更好的体验的技术.用技术来使网页适应从小到大( ...

  5. 响应式布局中为什么要使用em设置字体大小而不用px

    px像素(Pixel).相对长度单位.像素px是相对于不同设备显示器屏幕分辨率(pad/phone/pc)而言的.(引自CSS2.0手册) 1em指的是一个字体的大小,它会继承父级元素的字体大小,因此 ...

  6. 响应式布局之 px、em、 rem

    一.写在前面的话 作为一面前端开发者,对 px .em . rem 应该是再熟悉不过了,但大多数小伙伴应该都和我一样仅仅停留在了解的层面,并不是实质性的掌握它们.本文对三者进行了详细的总结和详细说明, ...

  7. 网站响应式布局/网站自适应问题+rem、em、px、pt及网站字体大小设配

    Bootstrap 网格系统: Bootstrap CSS: Bootstrap 组件及插件: 一.什么是响应式布局?       响应式布局是Ethan Marcotte在2010年5月份提出的一个 ...

  8. 响应式布局 max-device-width 与 max-width 的区别

    闲来没事,研究了一下多屏适配和响应式布局的 CSS. 第一种写法 @media screen and (max-device-width: 320px) { } @media screen and ( ...

  9. CSS3与页面布局学习笔记（四）——页面布局大全(负边距、双飞翼、多栏、弹性、流式、瀑布流、响应式布局)

    一.负边距与浮动布局 1.1.负边距 所谓的负边距就是margin取负值的情况,如margin:-100px,margin:-100%.当一个元素与另一个元素margin取负值时将拉近距离.常见的功能 ...

随机推荐

  1. call aplly笔记

    <script> /*1.每个函数都包含两个非继承而来的方法:apply()和call(). 2.他们的用途相同,都是在特定的作用域中调用函数. 3.接收参数方面不同,apply()接收两 ...

  2. Data Encryption Errors After Restoring Microsoft Dynamics CRM Database

    If you’re seeing an error similar to the one above, you’ve probably done a database backup and resto ...

  3. hihocoder 1485----hiho字符串

    hihocoder 1485:hiho字符串 描述 如果一个字符串恰好包含2个'h'.1个'i'和1个'o',我们就称这个字符串是hiho字符串. 例如"oihateher".&q ...

  4. 少个人保护？我来！——阿里云在ICANN第3届GDD峰会纪实

    西班牙马德里以足球和斗牛闻名于世,2017年5月9日至11日,ICANN第三届全球域名部门行业峰会(GDD)在这里召开.阿里云作为亚洲域名保有量最高的注册商,代表成千上万客户的利益与权力,派出代表,前 ...

  5. csv注入漏洞原理&&实战

    前言  为了找工作,巩固巩固知识.本文会介绍 csv 注入漏洞的原理,最后给出一个示例.  正文 在 csv 文件 和 xlsx 文件中的每一项的值如果是 =, @, +, - 就会被 excel 识 ...

  6. Java XML SAX 解析注意

    版权声明: 欢迎转载,但请保留文章原始出处 作者:GavinCT 出处:http://www.cnblogs.com/ct2011/p/4002738.html 什么时候可以把解析值赋给对象 一般从网 ...

  7. 读写JSON作配置文件

    个人不太喜欢XML,于是找了JSON来做配置,JSON虽然有很多引号,但这种key-value的形式,非常符合我的思维,就像是一个萝卜一个坑.最近在读写JSON文件,需要注意两个问题. 中文乱码: 直 ...

  8. leetCode题解之旋转数字

    1.题目描述 X is a good number if after rotating each digit individually by 180 degrees, we get a valid n ...

  9. selenium&phantomjs实战--漫话爬取

    为什么直接保存当前网页,而不是找到所有漫话链接,再有针对性的保存图片? 因为防盗链的原因,当直接保存漫话链接图片时,只能保存到防盗链的图片. #!/usr/bin/env python # _*_ c ...

  10. 第六章 函数、谓词、CASE表达式 6-3 CASE表达式

    一.什么是CASE表达式 CASE表达式是一种运算功能,意味着CASE表达式也是函数的一种. 它是SQL中数一数二的重要功能.必须好好学习掌握.   CASE表达式是在区分情况时使用的,这种情况的区分 ...