pug/jade template

Guide pug/jade 

템플릿 엔진 pug 마크업 작성 팁(?)에 대해 알아봅니다.

아래와 같이 pug 를 작성합니다.

Pug/jade

p.result_number
| 검색결과 :
span.
	총 #[strong.point_color_03 785] 건

p.result_number
	| 검색결과 :
	span.className.
		총 #[strong.point_color_03 785] 건
	b 강조

다음과 같이 HTML 로 컴파일됩니다.

html

<p class="result_number">검색결과 :
	<span>총
		<strong class="point_color_03">785</strong> 건 </span>
</p>

<p class="result_number">검색결과 :
	<span class="className">총
		<strong class="point_color_03">785</strong> 건</span>
	<b>강조</b>
</p>

Pug/jade

span.text.accent-1 <a href="#">[바로가기]</a>

a(href="#"): span.text 사이트+지역

html

<span class="text accent-1">
	<a href="#">[바로가기]</a>
</span>

<a href="#">
	<span class="text">사이트+지역</span>
</a>

Jaehee's WebClub