使用CSS 变量，轻松做响应式-安博app官网

css变量 它是CSS的新特性，让你能够在样式表中使用变量的能力，而且无需任何设置。老方法：使用css变量:它能够让你通过仅改变--base-font-size的值来改变app中所有原生的字体巨细。实例：pc:移动端：革新方案：重新排列整个网格结构，使用垂直排列取代牢固两列结构。

将框架整体上移了一点。对字体举行了缩放。到达效果：css：旧方法：大部门修改都需要将声明在媒体查询中重写一遍css变量：媒体查询中修改这些变量值这样的代码是不是比之前要简练多了？我们只需要专注于:root选择器就可以了。

我们将媒体查询中的4个声明淘汰到了1个，代码也从13行淘汰到了4行。固然，这只是一个简朴的例子。

想象一下，在一个大中型网站中，有一个--base-margin变量控制着所有的外边距。当你想要在媒体查询时修改属性，并不需要用庞大的声明填充整个媒体查询，只是简简朴单地修改这个变量值就可以了。------切图网首推前端项目实战培训——切入口（qierukou.com），开班在即，报名从速。

本文来源：安博app官网-www.bettertoolsco.com