摘 要：响应式网页设计可以解决网页在不同大小的设备上的显示问题，而电子地图的显示要求要比普通网页复杂，在其页面设计过程中需结合响应式技术和padding 百分比占位来实现电子地图适应不同的视口大小。
关键词：响应式网页设计；电子地图；媒体查询；CSS
中图分类号：TP393.092 文献标识码：A 文章编号：2096-4706（2019）02-0069-03
Research on Electronic Map Web Design Based on Responsive Technology
LIU Ruibing
（Quanzhou Preschool Education College，Quanzhou 362600，China）
Abstract：Responsive web design can solve the problem of displaying web pages on different sizes of devices，and the display requirements of electronic maps are more complex than ordinary web pages. In the process of page design，we need to combine the responsive technology and padding percentage occupancy to achieve electronic maps to adapt to different viewport sizes.
Keywords：responsive web design；electronic map；media query；CSS
参考文献：
[1] 张树明. 基于响应式Web 设计的网页模板的设计与实现[J]. 计算机与现代化，2013（6）：125-127.
[2] 吴多智，陈益全. 响应式网页设计案例实现与分析 [J]. 安徽电子信息职业技术学院学报，2016，15（2）：14-17+23.
[3] 李倩. 面向不同设备的响应式网页设计探析 [J]. 教育教学论坛，2017（12）：82-83.
[4] 毛娟. 网页制作中应用媒介查询实现响应式布局 [J]. 电脑编程技巧与维护，2016（19）：45-46.
[5] 徐健. 响应式网页设计案例实现与分析 [J]. 信息与电脑（理论版），2018（6）：13-15.
作者简介：刘瑞冰（1984-），男，福建永春人，教师，讲师，硕士，研究方向：计算机教学、计算机软件设计。