Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Pug.pdf

 Pug.pdf

darrenyaoyaoyao

November 13, 2020
Tweet

More Decks by darrenyaoyaoyao

Other Decks in Programming

Transcript

  1. 空⽩會影響編譯結果 div.remark p Pug rocks!! <div class="remark"> <p>Pug rocks!!</p> </div>

    div.remark p Pug rocks!! <div class=“remark"></div> <p>Pug rocks!!</p>
  2. 沒有 <, > 容易閱讀 nav div h1 My Website! ul

    li a Home li a Page 1 li a Page 2 input <nav> <div> <h1>My Website!</h1> </div> <ul> <li><a>Home</a></li> <li><a>Page 1</a></ li> <li><a>Page 2</a></ li> </ul> <input/> </nav>
  3. 屬性⽤括號表⽰ ul li a(href='/') Home li a(href='/page-1') Page 1 input.search(

    type='text' name='search' placeholder='Enter' ) <ul> <li> <a href=“/“>Home</a> </li> <li> <a href=“/page-1"> Page 1 </a> </li> </ul> <input class=“search" type="text" name=“search" placeholder="Enter"/>
  4. 換⾏ p | You are logged in as | [email protected]

    <p> You are logged in as [email protected] </p> p. Lorem ipsum dolor sit amet, tempor incididunt ut labore veniam, quis nostrud <p> Lorem ipsum dolor sit amet, tempor incididunt ut labore veniam, quis nostrud </p>