在html中生成动态地图
来源：互联网 发布：android 布局优化 编辑：程序博客网 时间：2024/05/22 17:18
在html中生成动态地图的步骤：
一、在谷歌收索地图页面中输入您要定位的地名：如，我要在 北京市天安门 这个地方定位
二、当点击收索的时候会自动生成url （地址信息），把图片缩放到您想要的大小，再点击左侧像链条似的图标，则显示如下：
三、选择合适的图片显示大小：
四、会生成如下的代码：
五、把代码copy到html文件中测会显示如下的效果：
代码如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>圆角边框</title>
<style type="text/css">
#sash_left { width:650px;height:515px; float:left; }
#sash_left ul { text-align:left; vertical-align:middle; padding-left:75px; }
#sash_left ul li { line-height:16px; margin:2px 0; }
.b1, .b2, .b3, .b4 { font-size:1px; overflow:hidden; display:block; }
.b1 { height:1px; background:#AAA; margin:0 5px; }
.b2 { height:1px; background:#E0E0E0; border-right:2px solid #AAA; border-left:2px solid #AAA; margin:0 3px; }
.b3 { height:1px; background:#E3E3E3; border-right:1px solid #AAA; border-left:1px solid #AAA; margin:0 2px; }
.b4 { height:2px; background:#E6E6E6; border-right:1px solid #AAA; border-left:1px solid #AAA; margin:0 1px; }
.contentb { height:515px; background:#E9E9E9; border-right:1px solid #AAA; border-left:1px solid #AAA; }
</style>
</head>
<body>
<div id="sash_left">
<b class="b1"></b><b class="b2"></b><b class="b3"></b><b class="b4"></b>
<div class="contentb">
<iframe width="650" height="500" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://ditu.google.cn/maps?f=q&source=s_q&hl=zh-CN&geocode=&q=%E5%8C%97%E4%BA%AC%E5%B8%82%E5%A4%A9%E5%AE%89%E9%97%A8+&aq=&sll=39.90403,116.407526&sspn=0.979726,2.705383&g=%E5%8C%97%E4%BA%AC%E5%B8%82&brcurrent=3,0x35f052c9ba46ac4d:0x70c38b0772e1e2d,0,0x35f053337198022f:0xe089829dec4936f0%3B5,0,0&ie=UTF8&hq=%E5%8C%97%E4%BA%AC%E5%B8%82%E5%A4%A9%E5%AE%89%E9%97%A8&t=m&z=15&iwloc=A&output=embed"></iframe><br /><small><a href="http://ditu.google.cn/maps?f=q&source=embed&hl=zh-CN&geocode=&q=%E5%8C%97%E4%BA%AC%E5%B8%82%E5%A4%A9%E5%AE%89%E9%97%A8+&aq=&sll=39.90403,116.407526&sspn=0.979726,2.705383&g=%E5%8C%97%E4%BA%AC%E5%B8%82&brcurrent=3,0x35f052c9ba46ac4d:0x70c38b0772e1e2d,0,0x35f053337198022f:0xe089829dec4936f0%3B5,0,0&ie=UTF8&hq=%E5%8C%97%E4%BA%AC%E5%B8%82%E5%A4%A9%E5%AE%89%E9%97%A8&t=m&z=15&iwloc=A" style="color:#0000FF;text-align:left">查看大图</a></small>
</div>
<b class="b4"></b><b class="b3"></b><b class="b2"></b><b class="b1"></b>
</div>
</body>
</html>
- 在html中生成动态地图
- 百度地图中动态生成网格
- [Javascript]在HTML页面中动态添加表格，动态生成行的示例
- asp.net在Render中加载Html来动态生成或者修改页面
- ASP.NET在RENDER中加载HTML来动态生成或者修改页面
- 在HTML中优雅的生成PDF
- 在页面中动态添加HTML
- 在HTML中实现动态的时钟
- 在HTML中如何动态显示时间
- 关于在HTML语言中使用影像地图
- 关于在html语言中使用影像地图
- 如何在Html中插入谷歌地图？
- 如何在HTML中调用百度地图API
- 如何在Html中插入谷歌地图？
- 动态生成HTML标签
- 动态页面生成 HTML
- C#动态生成html
- 动态生成HTML页
- [Usaco2011 Jan]道路和航线
- asp.net（C#）中文乱码问题
- 李炎恢jQuery笔记3
- Eclipse "failed to create the java virtual machine"
- Android -- make a phone call using Intent--使用意图拨打电话
- 在html中生成动态地图
- 李炎恢jQuery笔记4过滤选择器
- Spring 3.0 引文注入详解
- UIButton事件
- 李炎恢jQuery笔记5基础DOM和CSS操作
- 2013.11.20
- 李炎恢jQuery笔记6 DOM节点操作
- git 笔记记录（五） git重置
- 快速排序
