前端布局单位选择之 rem

简介: 前端布局单位选择之 remRoot em(REM)是CSS3中新定义的一种长度单位。和之前的em单位相比在使用上具有明显的优势。著名的响应式web框架Fundation就是用REMs作为基本的长度单位。

前端布局单位选择之 rem

Root em(REM)是CSS3中新定义的一种长度单位。和之前的em单位相比在使用上具有明显的优势。著名的响应式web框架Fundation就是用REMs作为基本的长度单位。

进行布局的话建议用less去写,因为less中可以用变量,这样我们可以省去频繁用计算器的时间了。

less中我们可以这样写;

@rem:40rem;

定义变量@rem 这里的40是指你打开谷歌开发者工具后点击移动端模拟时的html的font-size大小。

div{
width:200/@rem;
}

less会在编译的时候给计算出结果。

相关文章
|
1月前
|
前端开发 容器
【前端】1、flex 布局详解
【前端】1、flex 布局详解
43 0
|
3月前
|
编解码 移动开发 前端开发
【Bootstrap】<前端框架>Bootstrap布局容器&栅格网格系统
【1月更文挑战第17天】【Bootstrap】<前端框架>Bootstrap布局容器&栅格网格系统
|
3月前
|
前端开发 JavaScript
前端必看的8个HTML+CSS技巧 (八)瀑布流布局
前端必看的8个HTML+CSS技巧 (八)瀑布流布局
|
4月前
|
人工智能 前端开发 容器
【前端|CSS系列第4篇】CSS布局之网格布局
【前端|CSS系列第4篇】CSS布局之网格布局
|
5月前
|
前端开发 容器
前端CSS居中布局
前端CSS居中布局
63 0
|
6月前
|
前端开发 容器
前端页面布局之【Flex布局】详解
前端页面布局之【Flex布局】详解
74 0
|
6月前
|
前端开发 容器
前端页面布局之【Grid布局】详解
前端页面布局之【Grid布局】详解
391 0
|
6月前
|
XML 前端开发 Android开发
android 前端常用布局文件升级总结(二)
android 前端常用布局文件升级总结(二)
|
1月前
|
数据可视化 前端开发
web前端-Echarts-5.3高级可视化和图表组合布局
web前端-Echarts-5.3高级可视化和图表组合布局
|
1月前
|
编解码 前端开发 UED
前端需要完完全全掌握的这些布局方案
前端需要完完全全掌握的这些布局方案