基于CSS预处理器的网页适配多种浏览器尺寸的方法及系统

摘要

本发明提出了一种基于CSS预处理器的网页适配多种浏览器尺寸的方法，其包含：确定需要适配的多个不同的屏幕尺寸；按照需要适配的最大屏幕尺寸设计网站，得到设计稿；以宽度和/或高度为基准，得到每一种较小尺寸相对于最大尺寸的缩放比例；通过CSS预处理器编写可预处理样式表，在可预处理样式表中根据设计稿中每个元素的大小和位置属性结合缩放比例指定其在每种尺寸屏幕中的大小和位置变化规则；由CSS预处理器根据可预处理样式表中的各元素在每种尺寸屏幕中的大小和位置变化规则自动为每种屏幕尺寸生成相应的样式表。其优点是：前端开发人员只有一套样式表需要维护，相较现有的对每一屏幕尺寸分别编写一套样式表的模式来说，降低了维护成本。