Question

我正在尝试将layout.jade转换为车把。请等价于块内容和块边栏？

doctype html
html(lang='en')
  head
    title= title
    meta(charset='utf-8')
    meta(name='viewport', content='width=device-width, initial-scale=1')
    link(rel='stylesheet', href='https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css')
    script(src='https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js')
    script(src='https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js')
    link(rel='stylesheet', href='/stylesheets/style.css')
  body
    div(class='container-fluid')
      div(class='row')
        div(class='col-sm-2')
          block sidebar
            ul(class='sidebar-nav')
              li 
                a(href='/catalog') Home
              li 
                a(href='/catalog/books') All books
              li 
                a(href='/catalog/authors') All authors
              li 
                a(href='/catalog/genres') All genres
              li 
                a(href='/catalog/bookinstances') All book-instances
              li 
                hr
              li 
                a(href='/catalog/author/create') Create new author
              li 
                a(href='/catalog/genre/create') Create new genre
              li 
                a(href='/catalog/book/create') Create new book
              li 
                a(href='/catalog/bookinstance/create') Create new book instance (copy)

        div(class='col-sm-10')
          block content

转换为以下内容。我已经分别在{{{content}}}和{{{sidebar}}}中介绍了“块内容”和“块侧边栏”。

<!DOCTYPE html>
<html lang="en">
  <head>
    <title></title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <link rel="stylesheet" href="/stylesheets/style.css">
  </head>
  <body>
    <div class="container-fluid">
      <div class="row">
        <div class="col-sm-2">
            {{{sidebar}}}
          <ul class="sidebar-nav">
            <li> <a href="/catalog">Home</a></li>
            <li> <a href="/catalog/books">All books</a></li>
            <li> <a href="/catalog/authors">All authors</a></li>
            <li> <a href="/catalog/genres">All genres</a></li>
            <li> <a href="/catalog/bookinstances">All book-instances</a></li>
            <li> 
              <hr>
            </li>
            <li> <a href="/catalog/author/create">Create new author</a></li>
            <li> <a href="/catalog/genre/create">Create new genre</a></li>
            <li> <a href="/catalog/book/create">Create new book</a></li>
            <li> <a href="/catalog/bookinstance/create">Create new book        instance (copy)</a></li>
          </ul>
        </div>
        <div class="col-sm-10"> {{{content}}}
        </div>
      </div>
    </div>
  </body>
</html>

我尝试了玉器和哈巴车把，但是它们都不起作用！预先非常感谢。

将玉覆盖到车把上

0 个答案: