如何在HTML页面中插入百度地图

简介:

在网页制作时,如果想要把企业地址以地图的形式插入HTML页面中,可以通过百度地图轻松实现,当然,前提是注册百度账号并且通过实名认证


网址:http://api.map.baidu.com/lbsapi/creatmap/


第一步:定位中心点,选择城市以及你想要定位的具体地点

wKioL1frbfqSEkmPAAKLAEFVGUU192.png


第二步:设置地图,根据HTML页面预留的宽高,选择合适的尺寸

wKioL1frbqGCtEvCAAG88sNqF60849.png


第三步:添加标注,这里面的内容可以根据实际需求填写

wKiom1frbvyCsAYrAACQkA0HdRQ450.png


第四步:获取代码,点击复制把代码复制到一个单独的文件中,然后把对应的html代码和js代码添加你的项目中

wKioL1frb1rSqky-AAJ4HiMHq1U958.png


就这样简单的几步,就可以轻松搞定了,最终插入页面效果截图:

wKioL1frcGjzfNi-AAFkhuvz4Iw546.png

本文转自   frwupeng517   51CTO博客,原文链接:http://blog.51cto.com/dapengtalk/1857369

相关文章
HTML+CSS 实现通用的企业官网页面(记得收藏)
HTML+CSS 实现通用的企业官网页面(记得收藏)
|
2月前
|
前端开发 测试技术 定位技术
如何利用HTML和CSS构建企业级网站的全过程。从项目概述到页面结构设计,再到HTML结构搭建与CSS样式设计,最后实现具体页面并进行优化提升,全面覆盖了网站开发的关键步骤
本文深入介绍了如何利用HTML和CSS构建企业级网站的全过程。从项目概述到页面结构设计,再到HTML结构搭建与CSS样式设计,最后实现具体页面并进行优化提升,全面覆盖了网站开发的关键步骤。通过实例展示了主页、关于我们、产品展示、新闻动态及联系我们等页面的设计与实现,强调了合理布局、美观设计及用户体验的重要性。旨在为企业打造一个既专业又具吸引力的线上平台。
87 7
|
2月前
html页面点击按钮实现页面跳转功能
html页面点击按钮实现页面跳转
76 11
|
2月前
|
JavaScript 前端开发 Java
SpringBoot项目的html页面使用axios进行get post请求
SpringBoot项目的html页面使用axios进行get post请求
64 2
|
2月前
太便利了 !通义灵码方便生成html页面
太便利了 !通义灵码方便生成html页面
87 0
|
2月前
|
JavaScript 前端开发 Java
SpringBoot项目的html页面使用axios进行get post请求
SpringBoot项目的html页面使用axios进行get post请求
45 0
|
3月前
|
移动开发 前端开发 JavaScript
【HTML】HTML页面和常见标签
【HTML】HTML页面和常见标签
50 1
|
4月前
|
JavaScript 前端开发 Java
SpringBoot项目的html页面使用axios进行get post请求
SpringBoot项目的html页面使用axios进行get post请求
60 6
|
3月前
|
移动开发 HTML5
一个最简单的 HTML 页面结构如下:
HTML 是一种标记语言,用于描述网页结构。通过 `<html>`, `<head>`, `<body>` 等标签构建页面,支持文本、图像、链接、表格等多种元素。本文介绍了 HTML 基础,包括常用标签及创建简单网页的实例,帮助初学者快速入门。
100 0
|
3月前
|
XML Web App开发 数据格式
HTML 页面显示 XML 数据
10月更文挑战第2天