JavaScript È°¿ëÆÁ
2018.07.30 / 10:22
ºä ÅÛÇø´¿£Áø Jade (Pug) °ÀÇ 1ºÎ
summerman
Ãßõ ¼ö 217
ÅÛÇø´ ¿£ÁøÀº ¿©·¯°¡ÁöÀִµ¥ ±×Áß¿¡¼ Jade (Pug)°¡ °³³äÀ» ÀÌÇØÇϴµ¥ ½¬¿üÀ½.
¿ì¼± Jade (Pug)°¡ ¹«¾ùÀÎÁö ¼³¸íÇص帲
nodejs¿¡¼ µ¿ÀÛÇÏ´Â ºä ÅÛÇø´¿£ÁøÀÌ¶ó º¸½Ã¸é µÈ´Ù.
¸¶Å©¾÷ Äڵ带 ȹ±âÀûÀ¸·Î ÁÙ¿©ÁÖ°í ±¸Çö¿¡¸¸ ÁýÁßÇÒ¼öÀÖ´Ù
°£´ÜÇÏ°Ô ±¸¹® ¼³¸íÀ» ÇÏÀÚ¸é
1. ÅÂ±× ³»¿ë
ÄÚµå:°á°ú:
- h1 ÄÁÅÙÃ÷³»¿ë
- <h1>ÄÁÅÙÃ÷³»¿ë</h1>
2. ³»¿ë
ÄÚµå:°á°ú:
- | text
- text
3. ű×#¾ÆÀ̵ð
ÄÚµå:°á°ú:
- div#id
- <div id="id"></div>
* ÀÌÇظ¦ µ½±âÀ§ÇØ id°ªÀ» º¯°æÇÏ¸é ¾Æ·¡¿Í°°À̵ȴÙ
4. ű×#¾ÆÀ̵ð
ÄÚµå:°á°ú:
- div#test
- <div id="test"></div>
5. ű×.Ŭ·¡½º.Ŭ·¡½º
ÄÚµå:°á°ú:
- div.class1.class2
* ½ºÅ¸ÀϽÃÆ® class¸¦ À̾߱âÇϴ°ÍÀÌ´Ï... ÇÁ·Î±×·¡¹Ö °³³äÀÇ class¸¦ ¸»Çϴ°ÍÀÌ ¾Æ´Ï´Ù.
- <div class="class1 class2"></div>
6. ű×#¾ÆÀ̵ð.Ŭ·¡½º.Ŭ·¡½º
ÄÚµå:°á°ú:
- div#test.class1.class2
* ¼Ó¼º(attribute)Áß¿¡¼ id¿Í class¸¸ÀÌ À§¿Í°°ÀÌ Ãà¾àµÇ´Â ±â´ÉÀ» °¡Áø´Ù.
- <div id="test" class="class1 class2"></div>
7. ű×#¾ÆÀ̵ð.Ŭ·¡½º.Ŭ·¡½º
ÄÚµå:°á°ú:
- div#test.class1.class2
- <div id="test" class="class1 class2"></div>
8. .Ŭ·¡½º
ÄÚµå:°á°ú:
- .class1
* ¿©±â¼ ű׸¦ »ý·«µµ °¡´ÉÇÏ´Ù´Â°É ¾Ë¼öÀÖ´Ù.
- <div class="class1"></div>
9. div(¼Ó¼º="") text
ÄÚµå:°á°ú:
- div(style="color:black;") text
*±×·¸´Ù¸é id°ªÀ» ¼Ó¼ºÀ¸·Î ½áµµµÉ±î?
- <div style="color:black;">text</div>
ÄÚµå:°á°ú:
- div(id="test") text
* ´ç¿¬È÷ ½áµµµÈ´Ù. ÇÏÁö¸¸
- <div id="test">text</div>
ÄÚµå:*ÀÌ·±Äڵ带 ¾²¸é ÆäÀÌÁö ·»´õ¸µ ¿À·ù³´Ù...
- div#test(id="test") text
* ¿¹½ÃÄڵ带 ¿Ã·Áº»´Ù.
* ¿©±â¼ Áß¿äÇÑ°ÍÀº... µé¿©¾²±â¿¡ µû¶ó °á°ú°¡ ¿ÏÀüÈ÷ ´Þ¶óÁö±â¶§¹®¿¡ ¹Ýµå½Ã html ű׾ȿ¡ head°¡ Á¸ÀçÇؾ߸¸ ÇÑ´Ù.
- doctype html
- html(lang="ko")
- head
- meta(charset="utf-8")
- title NZO.IO
- body
- span body
°á°ú:
- <!DOCTYPE html><html lang="ko"><head><meta charset="utf-8"><title>NZO.IO</title></head><body><span>body</span></body></html>
*¸¸¾à ¿©±â¼ html°ú head°¡ °°Àº µé¿©¾²±â ¶óÀο¡ ÀÖ´Ù¸é...?°á°ú:
- doctype html
- html(lang="ko")
- head
- meta(charset="utf-8")
- title NZO.IO
- body
- span body
¡â
- <!DOCTYPE html><html lang="ko"></html><head><meta charset="utf-8"><title>NZO.IO</title></head><body><span>body</span></body>
htmlűװ¡ ¾û¶×Çѵ¥¼ ¹Ù·Î ´ÝÈ÷°í headűװ¡ ¿¸®´Â°ÍÀ» º¼¼öÀÖ´Ù.
jade´Â µé¿©¾²±â ¸Å¿ì Áß¿äÇÏ´Ù
´ÙÀ½Àå¿¡¼ °ÀÇÇÔ