index.ejs 1.78 KB
<!DOCTYPE html>
<html>

<head>
  <title>Animal Info</title>
  <!-- 합쳐지고 최소화된 최신 CSS -->
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">

  <!-- 부가적인 테마 -->
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap-theme.min.css">

  <!-- 합쳐지고 최소화된 최신 자바스크립트 -->
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>

  <style>
    html {
      min-height: 100%;
      position: relative;
    }

    body {
      height: 100%;
    }

    .content {
      display: flex;
      flex-direction: row;
      height: 500px;
    }

    .nav {
      flex: 1;
      background-color: black;
    }

    .jumbotron {
      flex: 3;
      text-align: center;
      background-color: white;
    }

    footer {
      position: absolute;
      bottom: 0;
      width: 100%;
      text-align: center;
      background-color: black;
      color: white;
      font-weight: lighter;
    }

    .header {
      width: 100%;
      background-color: black;
    }

    .logo {
      display: inline;
    }

    .theme {
      display: inline;
      color: white;
      text-align: center;
      font-size: xx-large;
    }
  </style>
</head>

<body>

  <header id="header">
    <%- include("components/header") -%>
  </header>

  <div class="content">
    <div class="nav">
      <%- include("components/navigation") -%>
    </div>

    <div class="jumbotron">
      <h2>서울시 동물 병원 검색</h2>
      <p>
        지역 선택
      </p>
      <select>
        <option value='금천구'>금천구</option>
      </select>
    </div>
  </div>


  <footer id="footer">
    <%- include("components/footer") -%>
  </footer>
</body>

</html>