區域元素 <section>

<section>為 HTML 文件的區域元素 (element) , <section> 用來規劃網頁內容的區域


    <!-- Portfolio Grid Section -->
    <section id="portfolio">
        <div class="container">
            <div class="row">
                <div class="col-lg-12 text-center">
                    <h2>課程簡介</h2>
                    <hr class="star-primary">
                </div>
            </div>
            <div class="row">
                <div class="col-sm-4 portfolio-item">
                    <a href="#step1" class="portfolio-link" data-toggle="modal">
                        <div class="caption">
                            <div class="caption-content">
                                <i class="fa fa-search-plus fa-3x"></i>
                            </div>
                        </div>
                        <img src="img/portfolio/cabin.png" class="img-responsive" alt="">
                    </a>
                    <div class="text-center">台南社大課程簡介</div>
                </div>
                <div class="col-sm-4 portfolio-item">
                    <a href="#step2" class="portfolio-link" data-toggle="modal">
                        <div class="caption">
                            <div class="caption-content">
                                <i class="fa fa-search-plus fa-3x"></i>
                            </div>
                        </div>
                        <img src="img/portfolio/cake.png" class="img-responsive" alt="">
                    </a>
                    <div class="text-center">雲端伺服器環境介紹(1)</div>
                </div>
                <div class="col-sm-4 portfolio-item">
                    <a href="#step3" class="portfolio-link" data-toggle="modal">
                        <div class="caption">
                            <div class="caption-content">
                                <i class="fa fa-search-plus fa-3x"></i>
                            </div>
                        </div>
                        <img src="img/portfolio/circus.png" class="img-responsive" alt="">
                    </a>
                    <div class="text-center">Bootstrap 3 & HTML5 入門上(2)</div>
                </div>
                <div class="col-sm-4 portfolio-item">
                    <a href="#step4" class="portfolio-link" data-toggle="modal">
                        <div class="caption">
                            <div class="caption-content">
                                <i class="fa fa-search-plus fa-3x"></i>
                            </div>
                        </div>
                        <img src="img/portfolio/game.png" class="img-responsive" alt="">
                    </a>
                    <div class="text-center">Bootstrap 3 & HTML5 入門下(3)</div>
                </div>
                <div class="col-sm-4 portfolio-item">
                    <a href="#step5" class="portfolio-link" data-toggle="modal">
                        <div class="caption">
                            <div class="caption-content">
                                <i class="fa fa-search-plus fa-3x"></i>
                            </div>
                        </div>
                        <img src="img/portfolio/safe.png" class="img-responsive" alt="">
                    </a>
                    <div class="text-center">設計網頁版型(上)(4)</div>
                </div>
                <div class="col-sm-4 portfolio-item">
                    <a href="#step6" class="portfolio-link" data-toggle="modal">
                        <div class="caption">
                            <div class="caption-content">
                                <i class="fa fa-search-plus fa-3x"></i>
                            </div>
                        </div>
                        <img src="img/portfolio/submarine.png" class="img-responsive" alt="">
                    </a>
                    <div class="text-center">設計網頁版型(中)(5)</div>
                </div>
                <div class="col-sm-4 portfolio-item">
                    <a href="#step7" class="portfolio-link" data-toggle="modal">
                        <div class="caption">
                            <div class="caption-content">
                                <i class="fa fa-search-plus fa-3x"></i>
                            </div>
                        </div>
                        <img src="img/portfolio/submarine.png" class="img-responsive" alt="">
                    </a>
                    <div class="text-center">設計網頁版型(下)(6)</div>
                </div>
            </div>
        </div>
    </section>