더북(TheBook)

속성 중 아이디와 클래스가 있는 경우에는 다음과 같이 표현할 수 있습니다. div 태그인 경우 div 문자는 생략할 수 있습니다.

퍼그

HTML

#login-button
.post-image
span#highlight
p.hidden.full
<div id="login-button"></div>
<div class="post-image"></div>
<span id="highlight"></span>
<p class="hidden full"></p>

HTML 텍스트는 다음과 같이 태그 또는 속성 뒤에 한 칸을 띄고 입력하면 됩니다.

퍼그

HTML

p Welcome to Express
button(type='submit') 전송
<p>Welcome to Express</p>
<button type="submit">전송</button>

에디터에서 텍스트를 여러 줄 입력하고 싶다면 다음과 같이 파이프(|)를 넣습니다. HTML 코드에서는 한 줄로 나옵니다.

퍼그

HTML

p
  | 안녕하세요.
  | 여러 줄을 입력합니다.
  br
  | 태그도 중간에 넣을 수 있습니다.
<p>
  안녕하세요. 여러 줄을 입력합니다.
  <br />
  태그도 중간에 넣을 수 있습니다.
</p>

style이나 script 태그로 CSS 또는 자바스크립트 코드를 작성하고 싶다면 다음과 같이 태그 뒤에 점(.)을 붙입니다.

퍼그

HTML

style.
  h1 {
    font-size: 30px;
  }
script.
  const message = 'Pug';
  alert(message);
<style>
  h1 {
    font-size: 30px;
  }
</style>
<script>
  const message = 'Pug';
  alert(message);
</script>

 

신간 소식 구독하기
뉴스레터에 가입하시고 이메일로 신간 소식을 받아 보세요.