css - 使用 css 框架时如何不弄乱样式

Question

我正在使用带有 Twitter Bootstrap 的 Google Maps API V3，这就是我得到的。标记甚至不能被识别为标记，缩放工具也不见了。

似乎 Twitter boostrap 正在搞乱地图画布的样式是否有办法排除某个元素被某个框架设置样式？或者只是简单地重置地图画布上的样式，使其不受 twitter bootstrap 样式表的影响？

除了 twitter bootstrap 的样式之外，还有一些代码：

<style type="text/css">
      html { height: 100% }
      body{ height: 100%; margin: 0; padding: 0 }
</style>

Answer 1

我相信这与他们添加

img{
    max-width: 100%;
}

建议的修复是这样的：

#mapContainer img{
    max-width: none;
}

见这里https://github.com/twitter/bootstrap/issues/1552

[更新]

看起来 2.0.4 的发布应该解决这个问题（我没有尝试过只是通过 change.log）

http://blog.getbootstrap.com/2012/06/bootstrap-2-0-4-released/

Answer 2

我有同样的问题Bootstrap + Google Maps。我假设您正在使用其他 CSS 文件（添加到您的后引导文件中），因此为了“覆盖”#map 容器中包含的图像中的该样式，只需在您自己的 CSS 中使用类似于以下代码的内容文件：

#mapContainer img{
    max-width: none;
}

就像subhaze所说的那样。它对我来说效果很好。

希望这对您有所帮助。