网页使用百度地图后,显示不全(已解决)

本文介绍了一种常见的百度地图在网页中显示不全的问题及解决方案。通过调整CSS样式,特别是针对图片的最大宽度设置,可以有效解决地图显示异常的情况。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

网页使用百度地图后,显示不全(已解决)

地图是用百度地图生成器生成的:
百度地图生成器地址:http://api.map.baidu.com/lbsapi/creatmap/

直接粘贴过来的代码,放到一个空白的新网页中是正常的
但是放到自己的网页中,就会显示不正常,如下图

这里写图片描述

错误原因分析:

发现在CSS中有一句(是用来防止图片宽度超过父容器宽度而设置的):

.container img {
    max-width: 100%;
}

然而就是因为这句话让百度地图显示出错,
因此解决办法:
方法1:把父容器css的 max-width: 100%; 这一句 删掉
方法2:直接给地图加一个css样式:

(地图的id为 #dituContent

#dituContent img{
  max-width: none;
}

修改后显示正常:

这里写图片描述

评论 7
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值