html レスポンシブ的GoogleMap
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了html レスポンシブ的GoogleMap相关的知识,希望对你有一定的参考价值。
.google-map {
position: relative;
width: 100%;
height: 0;
padding-bottom: 56.25%;
overflow: hidden;
}
.google-map iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
<div class="box_in">
<div class="google-map">
<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d25934.16131320576!2d139.68412633798107!3d35.65803388019965!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x60188b563b00109f%3A0x337328def1e2ab26!2z5riL6LC36aeF!5e0!3m2!1sja!2sjp!4v1515237636521" width="100%" height="457" frameborder="0" style="border:0" allowfullscreen></iframe>
</div>
</div>
以上是关于html レスポンシブ的GoogleMap的主要内容,如果未能解决你的问题,请参考以下文章
html レスポンシブ画像
html レスポンシブ対応metaと链接
html YouTube上の埋め込みをレスポンシブに
html レスポンシブ外部スタイル振り分け
scss レスポンシブ:リスト
scss レスポンシブテーブル