[์›น ๊ฐœ๋ฐœ์„ ์œ„ํ•œ ๊ธฐ์ดˆ์ง€์‹3] html๋กœ ์›น์‚ฌ์ดํŠธ ๋งŒ๋“ค๊ธฐ

์ง€๋‚œ [์›น ๊ฐœ๋ฐœ์„ ์œ„ํ•œ ๊ธฐ์ดˆ์ง€์‹3] ํฌ์ŠคํŒ…์—์„œ ๋งˆ์ง€๋ง‰์— ์กฐ๊ธˆ ๊ณต๊ฐœ๋๋˜
http://chamroro.dothome.co.kr/index.html ๋ฐ”๋กœ ์ด ํŽ˜์ด์ง€!

๋งŒ๋“ค๊ธฐ ์œ„ํ•ด ์‚ฌ์šฉ๋œ html ์— ๋Œ€ํ•œ ๋‚ด์šฉ์„ ์ •๋ฆฌํ•ด๋ณผ๊นŒ ํ•ฉ๋‹ˆ๋‹ค

์ „์ฒด์ ์ธ ๊ณจ๊ฒฉ์€ ์ด ๋ฉ์–ด๋ฆฌ 6๊ฐœ๋กœ ์ด๋ฃจ์–ด์ ธ์žˆ์Šต๋‹ˆ๋‹ค.

๐ŸŒž <div> : ์ œ์ผ ๋งŽ์ด ๋ณด์ด๋Š” ํƒœ๊ทธ๋กœ, divํƒœ๊ทธ๋Š” Division์˜ ์•ฝ์ž์ž…๋‹ˆ๋‹ค. ์›น์‚ฌ์ดํŠธ์˜ ๋ ˆ์ด์•„์›ƒ(์ „์ฒด์ ์ธ ํ‹€)์„ ๋งŒ๋“ค๋•Œ ์ฃผ๋กœ ์‚ฌ์šฉํ•ฉ๋‹ˆ๋‹ค. div๋Š” ์›นํŽ˜์ด์ง€์—์„œ ๋…ผ๋ฆฌ์  ๊ตฌ๋ถ„์„ ์ •์˜ํ•˜๋Š” ํƒœ๊ทธ์ž…๋‹ˆ๋‹ค. div ํƒœ๊ทธ๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ๊ฐ๊ฐ์˜ ๋ธ”๋ก(๊ณต๊ฐ„)์„ ์•Œ๋งž๊ฒŒ ๋ฐฐ์น˜ํ•˜๊ณ  CSS๋ฅผ ํ™œ์šฉํ•˜์—ฌ ์Šคํƒ€์ผ์„ ์ ์šฉํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ํŠนํžˆ ์š”์ฆ˜์—๋Š” ๋ ˆ์ด์•„์›ƒ ๋ฐฐ์น˜๋ฅผ ๊ฑฐ์˜ Div๋ฅผ ํ™œ์šฉํ•ด ๊ตฌ์„ฑํ•˜๋Š” ์ถ”์„ธ์ด๊ธฐ๋•Œ๋ฌธ์— ๊ทธ ์“ฐ์ž„์ƒˆ๋Š” ๋” ์ค‘์š”ํ•ด์กŒ๋‹ค๊ณ  ๋งํ•  ์ˆ˜ ์žˆ๊ฒ ์Šต๋‹ˆ๋‹ค.

๐ŸŒž <img> : img๋Š” HTML ๋ฌธ์„œ์— ์ด๋ฏธ์ง€๋ฅผ ์‚ฝ์ž…ํ•˜๋Š” ํƒœ๊ทธ์ž…๋‹ˆ๋‹ค.

์ฃผ์š” ์†์„ฑ์€ src, alt, width, height, loading์ž…๋‹ˆ๋‹ค.
src : ์ด๋ฏธ์ง€์˜ ๊ฒฝ๋กœ
alt : ์ด๋ฏธ์ง€๋ฅผ ํ‘œ์‹œํ•  ์ˆ˜ ์—†์„ ๋•Œ ์ถœ๋ ฅํ•  ๋‚ด์šฉ
width : ์ด๋ฏธ์ง€์˜ ๊ฐ€๋กœ ํฌ๊ธฐ
height : ์ด๋ฏธ์ง€์˜ ์„ธ๋กœ ํฌ๊ธฐ
loading : ์ด๋ฏธ์ง€ ๋กœ๋”ฉ ๋ฐฉ์‹

๐ŸŒž <a> : ๋งํฌ(link)๋Š” <a> ํƒœ๊ทธ๋กœ ๋งŒ๋“ญ๋‹ˆ๋‹ค. ๋งํฌ์˜ ๋Œ€์ƒ์€ ์›นํŽ˜์ด์ง€, ํŒŒ์ผ, ์ด๋ฉ”์ผ ๋“ฑ์ด ๋  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

์œ„์—๋Š” ๋ณธ์—ฐ ์›น์‚ฌ์ดํŠธ์˜ ํด๋ฆฝ ์•„์ด์ฝ˜์— ๋งํฌ๋ฅผ ๋„ฃ์–ด๋’€๋Š”๋ฐ, ๋ˆŒ๋Ÿฌ๋ณด์‹œ๋ฉด ๋ณธ์—ฐ ์‚ฌ์ดํŠธ๋กœ ์ด๋™ํ•ฉ๋‹ˆ๋‹ค ๐Ÿค

  • ๊ธฐ๋ณธ ๋ฌธ๋ฒ•
<a href="xxx">Label</a>

๐ŸŒž <i> :<i> ๋Š” ์•„์ด์ฝ˜ ํƒœ๊ทธ์ž…๋‹ˆ๋‹ค.

๋ฐ˜์‘ํ˜•

๋Œ“๊ธ€