網頁通過iframe嵌入百度地圖API時自適應屏幕

1、iframe標簽按照常規響應式的樣式寫就可以了，比如：

<style type="text/css">
iframe{width:100%;min-height:471px}
@media screen and (max-width: 640px) {
    #iframe{min-height:271px}
}
@media screen and (min-width:750px) and (max-width:800px){
    #iframe{min-height:271px}
}
</style>
<iframe src="/baidumap.html" id="iframe"></iframe> 

2、baidumap.html 百度地圖容器這樣寫就可以了

<!--百度地圖容器-->
<div id="dituContent"></div>

<style type="text/css">
    #dituContent{position: absolute;width:99%;height: 98%;}

    @media screen and (max-width: 640px) {
        #dituContent{width:98%;height: 97%;}
    }
</style>

3、公司地址坐標獲取

公司地址坐標可以通過百度“拾取坐標系統”獲取：

http://api.map.baidu.com/lbsapi/getpoint/index.html

或者直接創建地圖

http://api.map.baidu.com/lbsapi/creatmap/index.html

4、baidumap.html 示例下載

下載

注意，看你網站是https 還是 http ，里面調用不同百度api接口

標題、文字內容、經度緯度修改

詳情：https://www.dedehtml.com/help/baidumapapi-https.html

最終效果：