嵌入外部網頁

google 地圖：https://www.google.com.tw/maps?source=tldsi&hl=zh-TW
搜尋「台南社區大學」
https://www.google.com.tw/maps/place/%E5%8F%B0%E5%8D%97%E5%B8%82%E7%A4%BE%E5%8D%80%E5%A4%A7%E5%AD%B8/@23.0092652,120.2104488,17z/data=!3m1!4b1!4m2!3m1!1s0x346e76f752c9c9d9:0xbea0d3724d78932b?hl=zh-TW
取得嵌入語法

<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3672.3949857936086!2d120.21044879999998!3d23.00926520000001!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x346e76f752c9c9d9%3A0xbea0d3724d78932b!2z5Y-w5Y2X5biC56S-5Y2A5aSn5a24!5e0!3m2!1szh-TW!2stw!4v1442969240410" width="600" height="450" frameborder="0" style="border:0" allowfullscreen></iframe> 自行建立一個區塊


 <!-- 電子地圖-->
 <section id="maps">
     <div class="container">
         <div class="row">
             <div class="col-lg-12 text-center">
                 <h2>電子地圖</h2>
                 <hr class="star-primary">
             </div>
             <div class="row">
                 <div class="col-lg-12">
                     <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3672.3949857936086!2d120.21044879999998!3d23.00926520000001!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x346e76f752c9c9d9%3A0xbea0d3724d78932b!2z5Y-w5Y2X5biC56S-5Y2A5aSn5a24!5e0!3m2!1szh-TW!2stw!4v1442969240410"  frameborder="0" style="border:0;width:100%;height:450px;" allowfullscreen ></iframe>
                 </div>
             </div>
         </div>

     </div>
 </section>

修改樣式width:100%;height:450px;

加入導航

                    <li class="page-scroll">
                        <a href="#maps">電子地圖</a>
                    </li>