- ÇöÀç À§Ä¡
- home > ÄÄÇ»ÅÍ¡¤ICT¡¤¾îÇÐ > ÄÄÇ»ÅÍ¡¤IT µµ¼ > À¥»çÀÌÆ® > ÄÚµùÀº óÀ½À̶ó with À¥ ÆÛºí¸®½Ì[¿µÁø.com(¿µÁø´åÄÄ)]
ÀÌ Ã¥Àº HTML, CSS, javascript Å©°Ô 3ÆÄÆ®·Î ±¸¼ºµÇ¾î ÀÖ½À´Ï´Ù. °¢ ÆÄÆ®´Â ±âº» ¹®¹ýÀ» ¼³¸íÇÏ´Â ºÎºÐ°ú ±âÃÊ ºÎºÐ¿¡¼ ÇнÀÇÑ ³»¿ëÀ» º¹½ÀÇÒ ¼ö ÀÖ´Â ½ÇÀü ÇÁ·ÎÁ§Æ®·Î ±¸¼ºµÇ¾î ÀÖ½À´Ï´Ù. ƯÈ÷ javascript ÆÄÆ®¿¡¼´Â ±âÃÊ ¹®¹ý»Ó¸¸ ¾Æ´Ï¶ó À¥ÆäÀÌÁö ±¸Çö¿¡¼ ÀÚÁÖ »ç¿ëÇÏ´Â UI/UX È¿°ú¸¦ ±¸ÇöÇÒ ¼ö ÀÖ´Â °£´ÜÇÑ ½ÇÀü ¿¹Á¦¿Í ½ÇÀü ÇÁ·ÎÁ§Æ®·Î ±¸¼ºµÇ¾î ÀÖ½À´Ï´Ù.
ÀÌ Ã¥Àº ´ÙÀ½°ú °°ÀÌ ±¸¼ºµÇ¾î ÀÖ½À´Ï´Ù.
¤ýPart 1 HTML5
¤ýPart 2 CSS ±âÃÊ
¤ýPart 3 CSS Áß±Þ
¤ýPart 4 javascript ±âÃÊ
¤ýPart 5 javascript ÀÀ¿ë
¤ýPart 6 ½ÇÀü ÇÁ·ÎÁ§Æ®
ÇнÀ ¼ø¼´Â Part 1ºÎÅÍ ¼ø¼´ë·Î ÇнÀÇÏ¸é µÇ°Ú½À´Ï´Ù. óÀ½ºÎÅÍ ¸ðµç °ÍÀ» ¿Ü¿ö¹ö¸®°Ú´Ù°í ³Ê¹« Å« ¿å½ÉÀ» °¡Áö°í ½ÃÀÛÇÏ¸é ±Ý¹æ ÁöÄ¥ ¼ö ÀÖ½À´Ï´Ù. ¿ì¼± ÇнÀÀ» ÁøÇàÇÏ¸é¼ ÀÌ·¸°Ô Çß´õ´Ï ȸ鿡 ÀÌ·¸°Ô Ãâ·ÂÀÌ µÇ´ÂÁö Çϳª¾¿ È®ÀÎÇØ°¡¸é¼ ÀϺΠÀÌÇØ°¡ µÇÁö ¾Ê´Â ºÎºÐµéÀº ´ÙÀ½ °úÁ¤À¸·Î ³Ñ¾î°¡°í ÀÏ´Ü ÁøÇàÇغ¾´Ï´Ù. ±×·¸°Ô ÁøÇàÇÏ´Ù º¸¸é ¾ÕºÎºÐ¿¡¼ ÀÌÇØÇÏÁö ¸øÇß´ø ³»¿ëµéÀÌ µÞºÎºÐÀÇ CSS¿¡¼ ¶Ç´Â javascript¿¡¼ ÀÌÇصǴ ºÎºÐµéµµ ¸¹ÀÌ ÀÖ½À´Ï´Ù. ±×·¯´Ï óÀ½ºÎÅÍ °ú¿åÀ» ¹ö¸®°í Â÷±ÙÂ÷±Ù õõÈ÷ ÇнÀÇϽñ⠹ٶø´Ï´Ù.
¡¼ ´ë»ó µ¶ÀÚÃþ ¡½
- ÄÚµù¿¡ ´ëÇÑ ±âÃÊ°¡ ¾ø´Â ºÐ.
- ³» ¼ÕÀ¸·Î À¥ÆäÀÌÁö¸¦ ±¸¼ºÇغ¸°í ½ÍÀº ºÐ.
- À¥ ÆÛºí¸®½Ì ¹× ÇÁ·ÐÆ®¿£µå °³¹ß ÀÔ¹®ÀÚ
ÀÌ Ã¥Àº ´ÙÀ½°ú °°ÀÌ ±¸¼ºµÇ¾î ÀÖ½À´Ï´Ù.
¤ýPart 1 HTML5
¤ýPart 2 CSS ±âÃÊ
¤ýPart 3 CSS Áß±Þ
¤ýPart 4 javascript ±âÃÊ
¤ýPart 5 javascript ÀÀ¿ë
¤ýPart 6 ½ÇÀü ÇÁ·ÎÁ§Æ®
ÇнÀ ¼ø¼´Â Part 1ºÎÅÍ ¼ø¼´ë·Î ÇнÀÇÏ¸é µÇ°Ú½À´Ï´Ù. óÀ½ºÎÅÍ ¸ðµç °ÍÀ» ¿Ü¿ö¹ö¸®°Ú´Ù°í ³Ê¹« Å« ¿å½ÉÀ» °¡Áö°í ½ÃÀÛÇÏ¸é ±Ý¹æ ÁöÄ¥ ¼ö ÀÖ½À´Ï´Ù. ¿ì¼± ÇнÀÀ» ÁøÇàÇÏ¸é¼ ÀÌ·¸°Ô Çß´õ´Ï ȸ鿡 ÀÌ·¸°Ô Ãâ·ÂÀÌ µÇ´ÂÁö Çϳª¾¿ È®ÀÎÇØ°¡¸é¼ ÀϺΠÀÌÇØ°¡ µÇÁö ¾Ê´Â ºÎºÐµéÀº ´ÙÀ½ °úÁ¤À¸·Î ³Ñ¾î°¡°í ÀÏ´Ü ÁøÇàÇغ¾´Ï´Ù. ±×·¸°Ô ÁøÇàÇÏ´Ù º¸¸é ¾ÕºÎºÐ¿¡¼ ÀÌÇØÇÏÁö ¸øÇß´ø ³»¿ëµéÀÌ µÞºÎºÐÀÇ CSS¿¡¼ ¶Ç´Â javascript¿¡¼ ÀÌÇصǴ ºÎºÐµéµµ ¸¹ÀÌ ÀÖ½À´Ï´Ù. ±×·¯´Ï óÀ½ºÎÅÍ °ú¿åÀ» ¹ö¸®°í Â÷±ÙÂ÷±Ù õõÈ÷ ÇнÀÇϽñ⠹ٶø´Ï´Ù.
¡¼ ´ë»ó µ¶ÀÚÃþ ¡½
- ÄÚµù¿¡ ´ëÇÑ ±âÃÊ°¡ ¾ø´Â ºÐ.
- ³» ¼ÕÀ¸·Î À¥ÆäÀÌÁö¸¦ ±¸¼ºÇغ¸°í ½ÍÀº ºÐ.
- À¥ ÆÛºí¸®½Ì ¹× ÇÁ·ÐÆ®¿£µå °³¹ß ÀÔ¹®ÀÚ
ÀúÀÚ: ±èµ¿ÁÖ (ÁöÀºÀÌ)
ÁöÀºÀÌÀÇ ±Û
ÀÌ Ã¥ÀÇ Æ¯Â¡
º£Å¸ ¸®´õ
PART 1 HTML ±âÃÊ
1. HTMLÀÇ ±¸Á¶
2. ºí·Ï ¹× ÀζóÀÎ ·¹º§ ¿ä¼Ò
3. ÅؽºÆ® Á¤ÀÇ ¿ä¼Ò
4. div ¿ä¼Ò·Î ÀÛ¼ºÇÏ´Â ¹®¼ÀÇ ±×·ìÈ
5. HTML5 ¼½¼Å´×
6. Á¦¸ñ, ¹®´Ü, ±¸ºÐ¼±, Á¤ÇüÈµÈ ÅؽºÆ®
7. ¸ñ·ÏÀ» Ç¥ÇöÇÏ´Â ¿ä¼Ò
8. Ç¥¸¦ ¸¸µå´Â Å×ÀÌºí ¿ä¼Ò
9. ¾ÞÄ¿(Anchor)ÀÇ Ç¥Çö
10. À̹ÌÁö¿Í °ü·ÃµÈ ¿ä¼Òµé
11. Æû ¿ä¼ÒÀÇ Á¾·ù
12. ¿Àµð¿À, ºñµð¿À È°¿ë
À̹ø ÀåÀÇ ¸¶¹«¸®
¿¬½À ¹®Á¦
½ÇÀü ¿¹Á¦
PART 2 CSS ±âÃÊÆí
1. CSS ¹®¹ý
2. »ö»ó°ú ´ÜÀ§
3. ¼±ÅÃÀÚ
4. ¼±ÅÃÀÚ ¿ì¼±¼øÀ§
5. ¼Ã¼, ±Û ½ºÅ¸ÀÏ
6. ¸ñ·Ï ½ºÅ¸ÀÏ
7. display µð½ºÇ÷¹ÀÌ
8. overflow
9. background ½ºÅ¸ÀÏ
10. box model ¹Ú½º ¸ðµ¨
11. ·¹À̾ƿô positioning style
À̹ø ÀåÀÇ ¸¶¹«¸®
¿¬½À ¹®Á¦
PART 3 CSS Áß±ÞÆí
1. shadow
2. gradient
3. transition
4. animation
5. transform
6. responsive ¹ÝÀÀÇü
À̹ø ÀåÀÇ ¸¶¹«¸®
¿¬½À ¹®Á¦
½ÇÀü ¿¹Á¦
PART 4 javascript ±âÃÊ
1. ±âº» ¿ë¾î
2. º¯¼ö
3. »ê¼ú ¿¬»êÀÚ
4. ÇÔ¼ö
5. °´Ã¼
6. ¹è¿
7. Á¶°Ç¹®
8. ¹Ýº¹¹®
9. ¹®ÀÚ¿
10. ŸÀ̸Ó
11. ¼öÇÐ ¿¬»ê
À̹ø ÀåÀÇ ¸¶¹«¸®
¿¬½À ¹®Á¦
PART 5 javascript ÀÀ¿ë
1. DOM Á¶ÀÛ
2. ¼±ÅÃÀÚ
3. À̺¥Æ®
4. ECMAScript 6
À̹ø ÀåÀÇ ¸¶¹«¸®
¿¬½À ¹®Á¦
½ÇÀü ¿¹Á¦
PART 6 ½ÇÀü ÇÁ·ÎÁ§Æ®
1. ÁغñÇϱâ
2. ±âº» ½© »ý¼ºÇϱâ
3. µðÀÚÀÎ È®ÀÎ ¹× HTML ÀÛ¼ºÇϱâ
4. µðÀÚÀÎ ÂüÁ¶ÇÏ¿© CSS ÀÛ¼ºÇϱâ
5. CSS ÀÛ¼º
6. script ÀÛ¼º
ÇÁ·ÎÁ§Æ® ¸¶¹«¸®
¿¬½À ¹®Á¦ Á¤´ä
ã¾Æº¸±â
ÀÌ Ã¥ÀÇ Æ¯Â¡
º£Å¸ ¸®´õ
PART 1 HTML ±âÃÊ
1. HTMLÀÇ ±¸Á¶
2. ºí·Ï ¹× ÀζóÀÎ ·¹º§ ¿ä¼Ò
3. ÅؽºÆ® Á¤ÀÇ ¿ä¼Ò
4. div ¿ä¼Ò·Î ÀÛ¼ºÇÏ´Â ¹®¼ÀÇ ±×·ìÈ
5. HTML5 ¼½¼Å´×
6. Á¦¸ñ, ¹®´Ü, ±¸ºÐ¼±, Á¤ÇüÈµÈ ÅؽºÆ®
7. ¸ñ·ÏÀ» Ç¥ÇöÇÏ´Â ¿ä¼Ò
8. Ç¥¸¦ ¸¸µå´Â Å×ÀÌºí ¿ä¼Ò
9. ¾ÞÄ¿(Anchor)ÀÇ Ç¥Çö
10. À̹ÌÁö¿Í °ü·ÃµÈ ¿ä¼Òµé
11. Æû ¿ä¼ÒÀÇ Á¾·ù
12. ¿Àµð¿À, ºñµð¿À È°¿ë
À̹ø ÀåÀÇ ¸¶¹«¸®
¿¬½À ¹®Á¦
½ÇÀü ¿¹Á¦
PART 2 CSS ±âÃÊÆí
1. CSS ¹®¹ý
2. »ö»ó°ú ´ÜÀ§
3. ¼±ÅÃÀÚ
4. ¼±ÅÃÀÚ ¿ì¼±¼øÀ§
5. ¼Ã¼, ±Û ½ºÅ¸ÀÏ
6. ¸ñ·Ï ½ºÅ¸ÀÏ
7. display µð½ºÇ÷¹ÀÌ
8. overflow
9. background ½ºÅ¸ÀÏ
10. box model ¹Ú½º ¸ðµ¨
11. ·¹À̾ƿô positioning style
À̹ø ÀåÀÇ ¸¶¹«¸®
¿¬½À ¹®Á¦
PART 3 CSS Áß±ÞÆí
1. shadow
2. gradient
3. transition
4. animation
5. transform
6. responsive ¹ÝÀÀÇü
À̹ø ÀåÀÇ ¸¶¹«¸®
¿¬½À ¹®Á¦
½ÇÀü ¿¹Á¦
PART 4 javascript ±âÃÊ
1. ±âº» ¿ë¾î
2. º¯¼ö
3. »ê¼ú ¿¬»êÀÚ
4. ÇÔ¼ö
5. °´Ã¼
6. ¹è¿
7. Á¶°Ç¹®
8. ¹Ýº¹¹®
9. ¹®ÀÚ¿
10. ŸÀ̸Ó
11. ¼öÇÐ ¿¬»ê
À̹ø ÀåÀÇ ¸¶¹«¸®
¿¬½À ¹®Á¦
PART 5 javascript ÀÀ¿ë
1. DOM Á¶ÀÛ
2. ¼±ÅÃÀÚ
3. À̺¥Æ®
4. ECMAScript 6
À̹ø ÀåÀÇ ¸¶¹«¸®
¿¬½À ¹®Á¦
½ÇÀü ¿¹Á¦
PART 6 ½ÇÀü ÇÁ·ÎÁ§Æ®
1. ÁغñÇϱâ
2. ±âº» ½© »ý¼ºÇϱâ
3. µðÀÚÀÎ È®ÀÎ ¹× HTML ÀÛ¼ºÇϱâ
4. µðÀÚÀÎ ÂüÁ¶ÇÏ¿© CSS ÀÛ¼ºÇϱâ
5. CSS ÀÛ¼º
6. script ÀÛ¼º
ÇÁ·ÎÁ§Æ® ¸¶¹«¸®
¿¬½À ¹®Á¦ Á¤´ä
ã¾Æº¸±â
À¥ ¾ÖÇø®ÄÉÀÌ¼Ç ½ÃÀÛÀÇ ÇÙ½É! ÇÑ ±ÇÀ¸·Î HTML, CSS, javascript ÇØ°á ÀÌ Ã¥Àº À¥ ÆÛºí¸®½Ì¿¡ ´ëÇØ ¾Æ¹«·± Áö½ÄÀÌ ¾ø´Â »óÅ¿¡¼ ½ÃÀÛÇÒ ¼ö ÀÖµµ·Ï °³¹ß ȯ°æ ±¸ÃàºÎÅÍ ½ÃÀÛÇؼ ½ÇÀü ÇÁ·ÎÁ§Æ®±îÁö ½º½º·Î ÄÚµù ÇÒ ¼ö ÀÖµµ·Ï µµ¿ÍÁÖ°í ÀÖ½À´Ï´Ù. HTML ±âÃÊ¿¡¼´Â ´Ù¾çÇÑ Å±×ÀÇ »ç¿ë¹ýÀ» ÇнÀÇÏ°í À¥ÆäÀÌÁö Á¦ÀÛÀÇ °¡Àå Å« ¸ñÇ¥ÀÎ ³»¿ëÀ» Á¤È®ÇÏ°Ô Àü´ÞÇÏ°í, À¥ Ç¥ÁØÀ» ÁؼöÇÏ¿© ű׸¦ ÀÛ¼ºÇÒ ¼ö ÀÖ°Ô °¡¸£Ä¨´Ï´Ù. CSS ºÎºÐÀº HTML¿¡¼ »ç¿ëÇÏ´Â ÁÖ¿ä ¿ä¼Òµé¿¡ ´ëÇÑ ¼³¸íÀ» ÇÏ°í ÀÖ½À´Ï´Ù. ±×¸®°í µ¿ÀûÀÎ À¥»çÀÌÆ®¸¦ ±¸ÇöÇÏ´Â...
´õº¸±â