白色大氣風格的VI廣告設計企業網站源碼下載



8 28 10



模板描述:白色大氣風格 VI廣告設計 企業網站,白色大氣風格的VI廣告設計企業網站源碼下載html模板下載

代碼結構

1. 引入CSS

<link rel="stylesheet" href="assets/css/bootstrap.min.css">
<link rel="stylesheet" href="assets/css/font-awesome.min.css">
<link rel="stylesheet" href="assets/css/animate.css">
<link rel="stylesheet" href="assets/css/owl.carousel.css">
<link rel="stylesheet" href="assets/css/owl.theme.css">
<link rel="stylesheet" href="assets/css/style.css">

2. 引入JS

<script type="text/javascript" src="assets/js/modernizr.custom.97074.js"></script>
<script type="text/javascript" src="assets/js/jquery-2.1.3.min.js"></script>
<script type="text/javascript" src="assets/js/bootstrap.min.js"></script>
<script type="text/javascript" src="assets/js/owl.carousel.js"></script>
<script type="text/javascript" src="assets/js/jquery.hoverdir.js"></script>

3. HTML代碼

        <div id="home-page">
            <!-- site-navigation start -->  
            <nav id="mainNavigation" class="navbar navbar-dafault main-navigation" role="navigation">
                <div class="container">
                    <div class="navbar-header">
                        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#main-nav-collapse">
                            <span class="sr-only">Toggle navigation</span>
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                        </button>
                        <!-- navbar logo -->
                        <div class="navbar-brand">
                            <span class="sr-only">Avada Pro Agency</span>
                            <a href="index.html">
                                <img src="assets/img/main_logo.png" class="img-responsive center-block" alt="logo">
                            </a>
                        </div>
                        <!-- navbar logo -->
                    </div><!-- /.navbar-header -->
                    <!-- nav links -->
                    <div class="collapse navbar-collapse" id="main-nav-collapse">
                        <ul class="nav navbar-nav navbar-right text-uppercase">
                            <li>
                                <a href="index.html"><span>home</span></a>
                            </li>
                            <li class="dropdown">
                                <a href="#" class="dropdown-toggle" data-toggle="dropdown"><span>pages</span></a>
                                <ul class="dropdown-menu">
                                    <li>
                                        <a href="about.html">about</a>
                                    </li>
                                    <li>
                                        <a href="service.html">service</a>
                                    </li>
                                    <li>
                                        <a href="portfolio.html">portfolio</a>
                                    </li>
                                    <li>
                                        <a href="gallery.html">gallery</a>
                                    </li>
                                    <li>
                                        <a href="404.html">404 page</a>
                                    </li>
                                    <li>
                                        <a href="coming_soon.html">coming soon</a>
                                    </li>
                                </ul>  <!-- end of /.dropdown-menu -->
                            </li> <!-- end of /.dropdown -->
                            <li class="dropdown">
                                <a href="#" class="dropdown-toggle" data-toggle="dropdown"><span>blog</span></a>
                                <ul class="dropdown-menu">
                                    <li>
                                        <a href="multiple_blog_left_sidebar.html">multiple with left sidebar</a>
                                    </li>
                                    <li>
                                        <a href="multiple_blog.html">multiple with right sidebar</a>
                                    </li>
                                    <li>
                                        <a href="single_blog_left_sidebar.html">single with left sidebar</a>
                                    </li>
                                    <li>
                                        <a href="single_blog.html">single with right sidebar</a>
                                    </li>
                                    <li>
                                        <a href="single_blog_full_width.html">single full width</a>
                                    </li>
                                </ul> <!-- end of /.dropdown-menu -->
                            </li> <!-- end of /.dropdown -->
                            <li>
                                <a href="contact.html"><span>contact</span></a>
                            </li>
                        </ul>
                    </div><!-- nav links -->
                </div><!-- /.container -->
            </nav>
            <!-- site-navigation end -->
            <!-- header start -->
            <header id="header" class="header-wrapper home-parallax home-fade">
                <div class="header-overlay"></div>
                <div class="header-wrapper-inner">
                    <div class="container">
                        <div class="welcome-speech">
                            <h1>Welcome to our avada agency</h1>
                            <p>Everything you need to have in order to build a stunning website</p>
                            <a href="#" class="btn btn-white">
                                Our Works
                            </a>
                        </div><!-- /.intro -->
                    </div><!-- /.container -->
                </div><!-- /.header-wrapper-inner -->
            </header>
            <!-- /#header -->
            <div class="main-content">
                <!--  begin intro section -->
                <section class="intro bg-light-gray">
                    <div class="container">
                        <div class="row">
                            <div class="col-md-5">
                                <img src="assets/img/intro.jpg" class="img-responsive center-block" alt="intro">
                            </div>
                            <div class="col-md-7">
                                <div class="intro-description">
                                    <h2>avada the best agency for ever</h2>
                                    <p>
                                        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam ante ex, fermentum vel libero eget interdum semper libero. Curabitur egestas, arcu id tempor convallis.
                                    </p>
                                    <ul class="points">
                                        <li>
                                            <span>
                                                <i class="fa fa-star"></i>
                                            </span>
                                            Vestibulum pulvinar commodo malesuada.
                                        </li>
                                        <li>
                                            <span>
                                                <i class="fa fa-star"></i>
                                            </span>
                                            Pellentesque id massa et ligula convallis porta.
                                        </li>
                                        <li>
                                            <span>
                                                <i class="fa fa-star"></i>
                                            </span>
                                            Vivamus sed nunc sed ligula rhoncus sit amet eu elit.
                                        </li>
                                        <li>
                                            <span>
                                                <i class="fa fa-star"></i>
                                            </span>
                                            Curabitur in ipsum vel ipsum vehicula congue.
                                        </li>
                                    </ul> <!-- end of /.points -->
                                    <a href="#" class="btn btn-slategray">
                                        purchase
                                    </a> <!-- /purchase button -->
                                </div> <!-- end of /.intro-description -->
                            </div>
                        </div>
                    </div> <!-- end of /.container -->
                </section> 
                <!--  end of intro section -->
                <!--  begin feature section  -->
                <section class="bg-white feature">
                    <div class="container">
                        <div class="row">
                            <div class="col-md-3">
                                <div class="feature-content text-center">
                                    <div class="feature-icon-box">
                                        <div class="feature-icon center-block">
                                            <i class="fa fa-laptop"></i>
                                        </div>
                                    </div> <!--  end of /.feature-icon-box  -->
                                    <div class="feature-info">
                                        <h3 class="feature-heading">Responsive &amp; Multi-purpose</h3>
                                        <p class="feature-description">
                                            Class aptent taciti sociosqu ad litora torquent conubia nostra, per inceptos himenaeos.
                                        </p>  <!--   end of /.feature-description  -->
                                    </div> <!--   end of /.feature-info  -->
                                </div> <!--  end of /.feature-content  -->
                            </div>
                            <div class="col-md-3">
                                <div class="feature-content text-center">
                                    <div class="feature-icon-box">
                                        <div class="feature-icon center-block">
                                            <i class="fa fa-eye"></i>
                                        </div>
                                    </div> <!--  end of /.feature-icon-box  -->
                                    <div class="feature-info">
                                        <h3 class="feature-heading">Clean &amp; Clear</h3>
                                        <p class="feature-description">
                                            Class aptent taciti sociosqu ad litora torquent conubia nostra, per inceptos himenaeos.
                                        </p>  <!--   end of /.feature-description  -->
                                    </div> <!--   end of /.feature-info  -->
                                </div> <!--  end of /.feature-content  -->
                            </div>
                            <div class="col-md-3">
                                <div class="feature-content text-center">
                                    <div class="feature-icon-box">
                                        <div class="feature-icon center-block">
                                            <i class="fa fa-thumbs-o-up"></i>
                                        </div>
                                    </div> <!--  end of /.feature-icon-box  -->
                                    <div class="feature-info">
                                        <h3 class="feature-heading">Best UX</h3>
                                        <p class="feature-description">
                                            Class aptent taciti sociosqu ad litora torquent conubia nostra, per inceptos himenaeos.
                                        </p>  <!--   end of /.feature-description  -->
                                    </div> <!--   end of /.feature-info  -->
                                </div> <!--  end of /.feature-content  -->
                            </div>
                            <div class="col-md-3">
                                <div class="feature-content text-center">
                                    <div class="feature-icon-box">
                                        <div class="feature-icon center-block">
                                            <i class="fa fa-star"></i>
                                        </div>
                                    </div> <!--  end of /.feature-icon-box  -->
                                    <div class="feature-info">
                                        <h3 class="feature-heading">Good Feedback</h3>
                                        <p class="feature-description">
                                            Class aptent taciti sociosqu ad litora torquent conubia nostra, per inceptos himenaeos.
                                        </p>  <!--   end of /.feature-description  -->
                                    </div> <!--   end of /.feature-info  -->
                                </div> <!--  end of /.feature-content  -->
                            </div>
                        </div>
                    </div> <!-- end of /.container -->
                </section>  
                <!--   end of feature section  -->
                <!--  begin portfolio section  -->
                <section class="bg-light-gray">
                    <div class="container">
                        <div class="headline text-center">
                            <div class="row">
                                <div class="col-md-6 col-md-offset-3">
                                    <h2 class="section-title">show off our portfolio</h2>
                                    <p class="section-sub-title">
                                        absolutely stunning design &amp; functionality
                                    </p> <!-- /.section-sub-title -->
                                </div>
                            </div>
                        </div> <!-- /.headline -->
                        <div class="portfolio-item-list">
                            <div class="row">
                                <div class="col-md-4 col-sm-6">
                                    <div class="portfolio-item">
                                        <div class="item-image">
                                            <a href="#">
                                                <img src="assets/img/portfolio1.jpg" class="img-responsive center-block" alt="portfolio1">
                                                <div><span><i class="fa fa-plus"></i></span></div>
                                            </a>
                                        </div>
                                        <div class="item-description">
                                            <div class="row">
                                                <div class="col-xs-6">
                                                    <span class="item-name">
                                                        Oliver a Note
                                                    </span>
                                                    <span>
                                                        Fashion
                                                    </span>
                                                </div>
                                                <div class="col-xs-6">
                                                    <span class="like">
                                                        <i class="fa fa-heart-o"></i>
                                                        576
                                                    </span>
                                                </div>
                                            </div>
                                        </div> <!-- end of /.item-description -->
                                    </div> <!-- end of /.portfolio-item -->
                                </div>
                                <div class="col-md-4 col-sm-6">
                                    <div class="portfolio-item">
                                        <div class="item-image">
                                            <a href="#">
                                                <img src="assets/img/portfolio2.jpg" class="img-responsive center-block" alt="portfolio2">
                                                <div><span><i class="fa fa-plus"></i></span></div>
                                            </a>
                                        </div>
                                        <div class="item-description">
                                            <div class="row">
                                                <div class="col-xs-6">
                                                    <span class="item-name">
                                                        Shift Magazine
                                                    </span>
                                                    <span>
                                                        Photography
                                                    </span>
                                                </div>
                                                <div class="col-xs-6">
                                                    <span class="like">
                                                        <i class="fa fa-heart-o"></i>
                                                        576
                                                    </span>
                                                </div>
                                            </div>
                                        </div> <!-- end of /.item-description -->
                                    </div> <!-- end of /.portfolio-item -->
                                </div>
                                <div class="col-md-4 col-sm-6">
                                    <div class="portfolio-item">
                                        <div class="item-image">
                                            <a href="#">
                                                <img src="assets/img/portfolio3.jpg" class="img-responsive center-block" alt="portfolio3">
                                                <div><span><i class="fa fa-plus"></i></span></div>
                                            </a>
                                        </div>
                                        <div class="item-description">
                                            <div class="row">
                                                <div class="col-xs-6">
                                                    <span class="item-name">
                                                        Camp Pine Tree
                                                    </span>
                                                    <span>
                                                        Web Design
                                                    </span>
                                                </div>
                                                <div class="col-xs-6">
                                                    <span class="like">
                                                        <i class="fa fa-heart-o"></i>
                                                        576
                                                    </span>
                                                </div>
                                            </div>
                                        </div> <!-- end of /.item-description -->
                                    </div> <!-- end of /.portfolio-item -->
                                </div>
                                <div class="col-md-4 col-sm-6">
                                    <div class="portfolio-item">
                                        <div class="item-image">
                                            <a href="#">
                                                <img src="assets/img/portfolio4.jpg" class="img-responsive center-block" alt="portfolio4">
                                                <div><span><i class="fa fa-plus"></i></span></div>
                                            </a>
                                        </div>
                                        <div class="item-description">
                                            <div class="row">
                                                <div class="col-xs-6">
                                                    <span class="item-name">
                                                        Free Art App Design
                                                    </span>
                                                    <span>
                                                        Photography
                                                    </span>
                                                </div>
                                                <div class="col-xs-6">
                                                    <span class="like">
                                                        <i class="fa fa-heart-o"></i>
                                                        576
                                                    </span>
                                                </div>
                                            </div>
                                        </div> <!-- end of /.item-description -->
                                    </div> <!-- end of /.portfolio-item -->
                                </div>
                                <div class="col-md-4 col-sm-6">
                                    <div class="portfolio-item">
                                        <div class="item-image">
                                            <a href="#">
                                                <img src="assets/img/portfolio5.jpg" class="img-responsive center-block" alt="portfolio5">
                                                <div><span><i class="fa fa-plus"></i></span></div>
                                            </a>
                                        </div>
                                        <div class="item-description">
                                            <div class="row">
                                                <div class="col-xs-6">
                                                    <span class="item-name">
                                                        Large Poster Set
                                                    </span>
                                                    <span>
                                                        Marketing
                                                    </span>
                                                </div>
                                                <div class="col-xs-6">
                                                    <span class="like">
                                                        <i class="fa fa-heart-o"></i>
                                                        576
                                                    </span>
                                                </div>
                                            </div>
                                        </div> <!-- end of /.item-description -->
                                    </div> <!-- end of /.portfolio-item -->
                                </div>
                                <div class="col-md-4 col-sm-6">
                                    <div class="portfolio-item">
                                        <div class="item-image">
                                            <a href="#">
                                                <img src="assets/img/portfolio6.jpg" class="img-responsive center-block" alt="portfolio6">
                                                <div><span><i class="fa fa-plus"></i></span></div>
                                            </a>
                                        </div>
                                        <div class="item-description">
                                            <div class="row">
                                                <div class="col-xs-6">
                                                    <span class="item-name">
                                                        Skilet Album Cover
                                                    </span>
                                                    <span>
                                                        Business
                                                    </span>
                                                </div>
                                                <div class="col-xs-6">
                                                    <span class="like">
                                                        <i class="fa fa-heart-o"></i>
                                                        576
                                                    </span>
                                                </div>
                                            </div>
                                        </div> <!-- end of /.item-description -->
                                    </div> <!-- end of /.portfolio-item --> 
                                </div>
                            </div>
                        </div> <!-- end of portfolio-item-list -->
                    </div>
                </section>
                <!--   end of portfolio section  -->
                <!-- begin twitter-feed section -->
                <section class="twit-feed">
                    <div class="twit-feed-wrapper">
                        <div class="container">
                            <div class="row">
                                <div class="col-md-10 col-md-offset-1">
                                    <div id="twit" class="owl-carousel owl theme">
                                        <div class="item text-center">
                                            <div class="twit-content">
                                                <div class="twit-icon">
                                                    <i class="fa fa-twitter"></i>
                                                </div>
                                                <h3 class="text-capitalize">free stock photos: 74 best sites to find Awesome free images</h3>
                                                <p>
                                                    @themewagon <br/>
                                                    2 days ago on Twitter.com
                                                </p>
                                            </div>
                                        </div>
                                        <div class="item text-center">
                                            <div class="twit-content">
                                                <div class="twit-icon">
                                                    <i class="fa fa-twitter"></i>
                                                </div>
                                                <h3 class="text-capitalize">free stock photos: 74 best sites to find Awesome free images</h3>
                                                <p>
                                                    @themewagon <br/>
                                                    2 days ago on Twitter.com
                                                </p>
                                            </div>
                                        </div>
                                        <div class="item text-center">
                                            <div class="twit-content">
                                                <div class="twit-icon">
                                                    <i class="fa fa-twitter"></i>
                                                </div>
                                                <h3 class="text-capitalize">free stock photos: 74 best sites to find Awesome free images</h3>
                                                <p>
                                                    @themewagon <br/>
                                                    2 days ago on Twitter.com
                                                </p>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </section> <!--   end of /.twit-feed section  -->
                <!-- begin pricing section -->
                <section class="bg-light-gray">
                    <div class="container">
                        <div class="headline text-center">
                            <div class="row">
                                <div class="col-md-6 col-md-offset-3">
                                    <h2 class="section-title">affordable pricing</h2>
                                    <p class="section-sub-title">
                                        absolutely stunning design &amp; functionality
                                    </p> <!-- /.section-sub-title -->
                                </div>
                            </div>
                        </div> <!-- /.headline -->
                        <div class="row">
                            <div class="col-md-3 col-sm-6">
                                <div class="price-box">
                                    <h3>Standard</h3>
                                    <div class="price-info">
                                        <span>15 Projects</span>
                                        <span>30 GB Storage</span>
                                        <span>Ultimate Data Transfer</span>
                                        <span>50 GB Bandwith</span>
                                        <span>Enhanced Security</span>
                                        <span>24/7 Support</span>
                                        <p class="price"><sup>$</sup><span>25</span>/MO</p>
                                    </div> <!-- /.price-info -->
                                    <a href="#" class="btn pricing-btn">Get Started</a>
                                </div> <!-- /.price-box -->
                            </div>
                            <div class="col-md-3 col-sm-6">
                                <div class="price-box">
                                    <h3>Business</h3>
                                    <div class="price-info">
                                        <span>15 Projects</span>
                                        <span>30 GB Storage</span>
                                        <span>Ultimate Data Transfer</span>
                                        <span>50 GB Bandwith</span>
                                        <span>Enhanced Security</span>
                                        <span>24/7 Support</span>
                                        <p class="price"><sup>$</sup><span>35</span>/MO</p>
                                    </div> <!-- /.price-info -->
                                    <a href="#" class="btn pricing-btn">Get Started</a>
                                </div> <!-- /.price-box -->
                            </div>
                            <div class="col-md-3 col-sm-6">
                                <div class="price-box">
                                    <h3>Premium</h3>
                                    <div class="price-info">
                                        <span>15 Projects</span>
                                        <span>30 GB Storage</span>
                                        <span>Ultimate Data Transfer</span>
                                        <span>50 GB Bandwith</span>
                                        <span>Enhanced Security</span>
                                        <span>24/7 Support</span>
                                        <p class="price"><sup>$</sup><span>45</span>/MO</p>
                                    </div> <!-- /.price-info -->
                                    <a href="#" class="btn pricing-btn">Get Started</a>
                                </div> <!-- /.price-box -->
                            </div>
                            <div class="col-md-3 col-sm-6">
                                <div class="price-box">
                                    <h3>Ultimate</h3>
                                    <div class="price-info">
                                        <span>15 Projects</span>
                                        <span>30 GB Storage</span>
                                        <span>Ultimate Data Transfer</span>
                                        <span>50 GB Bandwith</span>
                                        <span>Enhanced Security</span>
                                        <span>24/7 Support</span>
                                        <p class="price"><sup>$</sup><span>55</span>/MO</p>
                                    </div> <!-- /.price-info -->
                                    <a href="#" class="btn pricing-btn">Get Started</a>
                                </div> <!-- /.price-box -->
                            </div>
                        </div>
                    </div>
                </section>
                <!-- end of pricing section -->
                <!--  begin testimonial section  -->
                <section class="bg-light-gray">
                    <div class="container">
                        <div class="headline text-center">
                            <div class="row">
                                <div class="col-md-6 col-md-offset-3">
                                    <h2 class="section-title">testimonials</h2>
                                    <p class="section-sub-title">
                                        absolutely stunning design &amp; functionality
                                    </p> <!-- /.section-sub-title -->
                                </div>
                            </div>
                        </div> <!-- /.headline -->
                        <div id="client-speech" class="owl-carousel owl-theme">
                            <div class="item">
                                <div class="row">
                                    <div class="col-md-6">
                                        <div class="client-box">
                                            <div class="about-client">
                                                <img src="assets/img/client1.jpg" alt="client1">
                                                <p class="client-intro">technext-ceo</p>
                                            </div> <!-- end of /.about-client -->
                                            <div class="main-speech">
                                                <p>
                                                    Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.
                                                </p>
                                            </div> <!-- end of /.main-speech  -->
                                        </div> <!-- end of /.client-box -->
                                    </div>
                                    <div class="col-md-6">
                                        <div class="client-box">
                                            <div class="about-client">
                                                <img src="assets/img/client2.jpg" alt="client2">
                                                <p class="client-intro">technext-ceo</p>
                                            </div> <!-- end of /.about-client -->
                                            <div class="main-speech">
                                                <p>
                                                    It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that.
                                                </p>
                                            </div> <!-- end of /.main-speech  -->
                                        </div> <!-- end of /.client-box -->
                                    </div>
                                </div>
                            </div>
                            <div class="item">
                                <div class="row">
                                    <div class="col-md-6">
                                        <div class="client-box">
                                            <div class="about-client">
                                                <img src="assets/img/client1.jpg" alt="client3">
                                                <p class="client-intro">technext-ceo</p>
                                            </div> <!-- end of /.about-client -->
                                            <div class="main-speech">
                                                <p>
                                                    Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.
                                                </p>
                                            </div> <!-- end of /.main-speech  -->
                                        </div> <!-- end of /.client-box -->
                                    </div>
                                    <div class="col-md-6">
                                        <div class="client-box">
                                            <div class="about-client">
                                                <img src="assets/img/client2.jpg" alt="client4">
                                                <p class="client-intro">technext-ceo</p>
                                            </div> <!-- end of /.about-client -->
                                            <div class="main-speech">
                                                <p>
                                                    It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that.
                                                </p>
                                            </div> <!-- end of /.main-speech  -->
                                        </div> <!-- end of /.client-box -->
                                    </div>
                                </div>
                            </div>
                            <div class="item">
                                <div class="row">
                                    <div class="col-md-6">
                                        <div class="client-box">
                                            <div class="about-client">
                                                <img src="assets/img/client1.jpg" alt="client5">
                                                <p class="client-intro">technext-ceo</p>
                                            </div> <!-- end of /.about-client -->
                                            <div class="main-speech">
                                                <p>
                                                    Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.
                                                </p>
                                            </div> <!-- end of /.main-speech  -->
                                        </div> <!-- end of /.client-box -->
                                    </div>
                                    <div class="col-md-6">
                                        <div class="client-box">
                                            <div class="about-client">
                                                <img src="assets/img/client2.jpg" alt="client6">
                                                <p class="client-intro">technext-ceo</p>
                                            </div> <!-- end of /.about-client -->
                                            <div class="main-speech">
                                                <p>
                                                    It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that.
                                                </p>
                                            </div> <!-- end of /.main-speech  -->
                                        </div> <!-- end of /.client-box -->
                                    </div>
                                </div>
                            </div>
                        </div> <!-- end of /#client-speech  /.owl-carousel -->
                    </div> <!-- end of .container -->
                </section> 
                <!--  end of testimonial  section -->
            </div> <!-- end of /.main-content -->
            <footer>
                <div class="container">
                    <div class="row">
                        <!-- useful links -->
                        <div class="col-md-3 col-sm-6 col-xs-6 footer-widget">
                            <h4>Useful Links</h4>
                            <ul class="row footer-links">
                                <div class="col-md-6 col-sm-6 col-xs-6">
                                    <li><a href="#">Web Design</a></li>
                                    <li><a href="#">About Us</a></li>
                                    <li><a href="#">Mobile</a></li>
                                    <li><a href="#">Blog</a></li>
                                    <li><a href="#">Services</a></li>
                                </div>
                                <div class="col-md-6 col-sm-6 col-xs-6">
                                    <li><a href="#">Organization</a></li>
                                    <li><a href="#">Career</a></li>
                                    <li><a href="#">Media</a></li>
                                    <li><a href="#">24/7</a></li>
                                    <li><a href="#">Right Way</a></li>
                                </div>
                            </ul>
                        </div>
                        <!-- recent news -->
                        <div class="col-md-3 col-sm-6 col-xs-6 footer-widget">
                            <h4>Recent News</h4>
                            <div class="row footer-news">
                                <div class="col-md-4 col-sm-4 col-xs-6">
                                    <img src="assets/img/intro.jpg" class="img-responsive center-block" alt="recent news 1">
                                </div>
                                <div class="col-md-8 col-sm-4 col-xs-6">
                                    <div class="row">
                                        <p class="text-capitalize">
                                            <a href="#">
                                                a clear website gives more experience to the visitors
                                            </a>
                                        </p>
                                        <p class="news-date">Dec 12,2019</p>
                                    </div>
                                </div>
                            </div> <!-- /.footer-news -->
                            <div class="row footer-news">
                                <div class="col-md-4 col-sm-4 col-xs-6">
                                    <img src="assets/img/intro.jpg" class="img-responsive center-block" alt="recent news 2">
                                </div>
                                <div class="col-md-8 col-sm-4 col-xs-6">
                                    <div class="row">
                                        <p class="text-capitalize">
                                            <a href="#">
                                                a clear website gives more experience to the visitors
                                            </a>
                                        </p>
                                        <p class="news-date">Dec 12,2019</p>
                                    </div>
                                </div>
                            </div> <!-- /.footer-news -->
                        </div> <!-- /.footer-widget -->
                        <!-- news-letter -->
                        <div class="col-md-3 col-sm-6 col-xs-6 footer-widget">
                            <h4>E-News-Letter</h4>
                            <p>Sign up for our mailing list to get latest updates and offers</p>
                            <div class="input-group margin-bottom-sm">
                                <input class="form-control" type="text" placeholder="Email address">
                                <span class="input-group-addon">
                                    <i class="fa fa-paper-plane fa-fw"></i>
                                </span>
                            </div>
                            <p>We respect your privacy</p>
                        </div> <!-- /.footer-widget -->
                        <!-- about avada agency -->
                        <div class="col-md-3 col-sm-6 col-xs-6 footer-widget">
                            <h4>Avada Agency</h4>
                            <p>
                                HUGE Website Builder is a big library of pre-designed web elements which help you to create website in few minutes.
                            </p>
                            <div class="footer-address">
                                <p>
                                    1-800-123-HELLO  <br>
                                    [email protected]
                                </p>
                            </div>
                            <div class="row">
                                <div class="col-md-12">
                                    <ul class="footer-share-button">
                                        <li><a href="#"><i class="fa fa-twitter"></i></a></li>
                                        <li><a href="#"><i class="fa fa-google-plus"></i></a></li>
                                        <li><a href="#"><i class="fa fa-facebook"></i></a></li>
                                        <li><a href="#"><i class="fa fa-linkedin"></i></a></li>
                                        <li><a href="#"><i class="fa fa-youtube"></i></a></li>
                                        <li><a href="#"><i class="fa fa-pinterest"></i></a></li>
                                        <li><a href="#"><i class="fa fa-instagram"></i></a></li>
                                    </ul> <!-- /.footer-share-button -->
                                </div>
                            </div>
                        </div> <!-- /.footer-widget -->
                    </div>
                </div>
            </footer>
            <!-- footer-navigation start -->  
            <nav class="hidden-xs hidden-sm navbar footer-nav" role="navigation">
                <div class="container">
                    <div class="navbar-header">
                        <!-- navbar logo -->
                        <div class="navbar-brand">
                            <span class="sr-only">&copy;THEMEWAGON</span>
                            <a href="index.html">
                                Copyright &copy; 2019.Company name All rights reserved.
                            </a>
                        </div>
                        <!-- navbar logo -->
                    </div><!-- /.navbar-header -->
                    <!-- nav links -->
                    <div class="collapse navbar-collapse" id="main-nav-collapse">
                        <ul class="nav navbar-nav navbar-right text-capitalize">
                            <li><a href="#about">
                                <span>home</span>
                            </a></li>
                            <li><a href="#services">
                                <span>pages</span>
                            </a></li>
                            <li><a href="#portfolio">
                                <span>features</span>
                            </a></li>
                            <li><a href="#team">
                                <span>portfolio</span>
                            </a></li>
                            <li><a href="#pricing">
                                <span>blog</span>
                            </a></li>
                            <li><a href="#blog">
                                <span>shop</span>
                            </a></li>
                            <li><a href="#contact">
                                <span>contact</span>
                            </a></li>
                        </ul>
                    </div><!-- nav links -->
                </div><!-- /.container -->
            </nav>
            <!-- footer-navigation end -->
        </div> <!-- end of /#home-page -->
        <!--  Necessary scripts  -->
        <!-- script for portfolio section using hoverdirection -->
        <script type="text/javascript">
            $(function() {
                $('.portfolio-item > .item-image').each( function() { $(this).hoverdir({
                    hoverDelay : 75
                }); } );
            });
        </script>
        <!-- script for twitter-feed using owl carousel-->
        <script type="text/javascript">
            $(document).ready(function() {
                $("#twit").owlCarousel({
                    navigation : true, // Show next and prev buttons
                    slideSpeed : 100,
                    paginationSpeed : 400,
                    navigationText : false,
                    singleItem: true,
                    autoPlay: true,
                    pagination: false
                });
            });
        </script>
        <!-- script for testimonial section using owl carousel -->
        <script type="text/javascript">
            $(document).ready(function() {
                $("#client-speech").owlCarousel({
                    autoPlay: 5000, //Set AutoPlay to 3 seconds
                    stopOnHover: true,
                    singleItem:true
                });
            });
        </script>



用戶評論
大牛,別默默的看了,快登錄幫我點評一下吧!:)      登錄 | 注冊


熱門標簽: 行業 企業 公司 工廠 分類 響應式 自適應 設備 風格 顏色 企業 行業 公司 工廠 bootstrap bootstrap自適應 bootstrap響應式 歐美風 歐美 歐洲 美洲 pc+wap 移動+電腦 手機+電腦 簡潔 簡約 簡單 白色 設計 設計公司
?
×
×

注冊

官方QQ群

掃描上面二維碼加微信群

官方QQ群

jQuery/js討論群
群號:642649996
Css3+Html5討論群
群號:322131262

加群請備注:從官網了解到

老夫子电子 东方6+1投注 从事基金行业最赚钱 赚钱好方法 360老时时彩安全购彩 河南快三规则 今日中国福利彩票开奖号码查询 视频美女麻将馆修改 老时时彩走势图 山东时时彩后一走势 怎么用东方头条赚钱 单机四川麻将下载 山水云南麻将昆明麻将 围棋网页游戏 甘肃11选5走势图最新 拍视频怎么通过快手赚钱吗 彩票网 号百彩票