<!DOCTYPE HTML>
<html lang="zh-TW">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1">

        <title>Looknow!</title>
        <!-- jQuery -->
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>

        <!-- Latest compiled and minified CSS -->
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">

        <!-- Optional theme -->
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">

        <!-- Latest compiled and minified JavaScript -->
        <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>

        <!-- customized css -->
        <link rel="stylesheet" href="./css/looknow.css">

    </head>
    <body>
        <nav class="navbar navbar-default">
            <div class="container">
                <div class="navbar-header">
                    <a class="navbar-brand dropdown-toggle" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
                        <span class="glyphicon glyphicon-menu-hamburger" aria-hidden="true"></span>
                    </a>
                    <ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
                        <li><a href="#">Action</a></li>
                        <li role="separator" class="divider"></li>
                        <li><a href="#">Another action</a></li>
                        <li role="separator" class="divider"></li>
                        <li><a href="#">Something else here</a></li>
                        <li role="separator" class="divider"></li>
                        <li><a href="#">Separated link</a></li>
                    </ul>
                </div>
                <form class="navbar-form navbar-right ">
                    <a class="navbar-text" href="#"><span class="glyphicon glyphicon-search" aria-hidden="true"></span></a>
                    <a class="navbar-text" href="#"><span class="glyphicon glyphicon-shopping-cart" aria-hidden="true"></span></a>
                    <a class="navbar-text" href="#"><span class="glyphicon glyphicon-user" aria-hidden="true"></span></a>
                </form><!--/.navbar-collapse -->
            </div>
        </nav>

        <div class="container inline-content">
            <img src="./images/Logo.png">
        </div>
        <div class="navbar inline-content hidden-xs hidden-sm">
            <ul class="nav nav-pills">
                <li><a href="#">Button</a></li>
                <li><a href="#">Button</a></li>
                <li><a href="#">Button</a></li>
                <li><a href="#">Button</a></li>
                <li><a href="#">Button</a></li>
                <li><a href="#">Button</a></li>
            </ul>
        </div>
        <div class="container inline-content">
            <div class="row">
                <div class="col-md-4">
                    <a href="#"><img class="img-responsive" src="./images/ad-banner-1.png"></a>
                </div>
                <div class="col-md-4">
                    <a href="#"><img class="img-responsive" src="./images/ad-banner-2.png"></a>
                </div>
                <div class="col-md-4">
                    <a href="#"><img class="img-responsive" src="./images/ad-banner-3.png"></a>
                </div>
            </ul>
        </div>