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