속성 중 아이디와 클래스가 있는 경우에는 다음과 같이 표현할 수 있습니다. 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>

     

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