zoukankan      html  css  js  c++  java
  • 爽爽的首页

    <template>
        <div>
          <div class="app-head">
            <div class="app-head-inner ">
              <router-link :to="{path: '/'}" class="head-logo">
                <img src="../assets/logo.png">
              </router-link>
              <div class="head-nav">
                <ul class="nav-list">
                  <li>登录</li>
                  <li class="nav-pile">|</li>
                  <li>注册</li>
                  <li class="nav-pile">|</li>
                  <li>关于</li>
                </ul>
              </div>
            </div>
          </div>
          <div class="app-content">content</div>
          <div class="app-foot">
            <p>© 2016 finshnal MIT</p>
          </div>
        </div>
    </template>
    
    <script>
    export default {
      name: 'Layout',
      data () {
      }
    }
    </script>
    <style>
    /* http://meyerweb.com/eric/tools/css/reset/
       v2.0 | 20110126
       License: none (public domain)
    */
    
    html, body, div, span, applet, object, iframe,
    h1, h2, h3, h4, h5, h6, p, blockquote, pre,
    a, abbr, acronym, address, big, cite, code,
    del, dfn, em, img, ins, kbd, q, s, samp,
    small, strike, strong, sub, sup, tt, var,
    b, u, i, center,
    dl, dt, dd, ol, ul, li,
    fieldset, form, label, legend,
    table, caption, tbody, tfoot, thead, tr, th, td,
    article, aside, canvas, details, embed,
    figure, figcaption, footer, header, hgroup,
    menu, nav, output, ruby, section, summary,
    time, mark, audio, video {
      margin: 0;
      padding: 0;
      border: 0;
      font-size: 100%;
      font: inherit;
      vertical-align: baseline;
    }
    /* HTML5 display-role reset for older browsers */
    article, aside, details, figcaption, figure,
    footer, header, hgroup, menu, nav, section {
      display: block;
    }
    body {
      line-height: 1;
    }
    ol, ul {
      list-style: none;
    }
    blockquote, q {
      quotes: none;
    }
    blockquote:before, blockquote:after,
    q:before, q:after {
      content: '';
      content: none;
    }
    table {
      border-collapse: collapse;
      border-spacing: 0;
    }
    a {
      color: inherit;
      text-decoration: none;
    }
    body {
      background: #f0f2f5;
      font-family: "Helvetica Neue",Helvetica,Arial,"Hiragino Sans GB","Hiragino Sans GB W3","Microsoft YaHei UI","Microsoft YaHei","WenQuanYi Micro Hei",sans-serif;
      font-size: 14px;
      color: #444;
    }
    .app-head {
      background: #363636;
      color: #b2b2b2;
      height: 90px;
      line-height: 90px;
       100%;
    }
    .app-head-inner {
       1200px;
      margin: 0 auto;
    }
    .head-logo {
      float: left;
      margin-top: 20px;
    }
    .head-logo img {
       50px;
    }
    .head-nav {
      float: right;
    }
    .head-nav ul {
      overflow: hidden;
    }
    .head-nav li {
      cursor: pointer;
      float: left;
    }
    .nav-pile {
      padding: 0 10px;
    }
    .app-foot {
      text-align: center;
      height: 80px;
       100%;
      line-height: 80px;
      background: #e3e4e8;
      clear: both;
      margin-top: 30px;
    }
    .container {
       1200px;
      margin: 0 auto;
    }
    .hr {
      height: 1px;
       100%;
      background: #ddd;
    }
    .button {
      background: #4fc08d;
      color: #fff;
      display: inline-block;
      padding: 10px 20px;
      cursor: pointer;
    }
    .button:hover {
      background: #4fc08d;
    }
    .g-form {
    
    }
    .g-form-line {
      padding: 15px 0;
    }
    .g-form-label {
       100px;
      font-size: 16px;
      display: inline-block;
    }
    .g-form-input {
      display: inline-block;
    }
    .g-form-input input {
      height: 30px;
       200px;
      line-height: 30px;
      vertical-align: middle;
      padding: 0 10px;
      border: 1px solid #ccc;
    }
    .g-form-btn {
      padding-left: 100px;
    }
    </style>
    

      

  • 相关阅读:
    jquery toggle(listenerOdd, listenerEven)
    struts quick start
    hdu 1518 Square (dfs)
    hdu 2544 最短路 (最短路径)
    hdu 1754 I Hate It (线段树)
    hdu 1856 More is better (并查集)
    hdu 1358 Period (KMP)
    hdu 2616 Kill the monster (DFS)
    hdu 2579 Dating with girls(2) (bfs)
    zoj 2110 Tempter of the Bone (dfs)
  • 原文地址:https://www.cnblogs.com/tabCtrlShift/p/9163972.html
Copyright © 2011-2022 走看看