'HTML ์ด๋ฆฐ์ด' ๋ฅผ ์ํ ๊ธฐ์ด ๊ฐ์ ๐
์๋
ํ์ธ์, ๊ฐ๋ฐ์ ์ถ์ ๊ฐ์ฌ + ์ด๋ณด ์ ํ๋ฒ ์ ๋
ธ์ฝ๋ฉ์
๋๋ค!
๋ณธ ๊ฐ์๋ ๊ฐ์ ์๊ฐ์ ๋ง๋ฌด๋ฆฌ ์ธ์ฌ๋ฅผ ํฌํจ, ์ด 18๊ฐ ์์์ผ๋ก ๊ตฌ์ฑ๋ ์
๋ฌธ์์ฉ HTML ๊ฐ์์
๋๋ค.
HTML์ ์ฒ์ ์ ํ๋ ์
๋ฌธ์ ๋ถ๋ค์ด ๋ถ๋ด์์ด ๊ณต๋ถํ์ค ์ ์๋ ๊ฐ์์
๋๋ค.
๊ฐ ์์
์์์ ๋ชจ๋ ๋ค์๊ณผ ๊ฐ์ ํ๋ฆ์ผ๋ก ์งํ๋ฉ๋๋ค.
- ๊ธฐ์ด ์ด๋ก : ์ฃผ์ ๊ฐ๋
๋ค์ ์๊ธฐ ์ฝ๊ฒ ์ค๋ช
- ์ค์ต ์๋ด : ํ์ตํ ๋ด์ฉ์ ์ง์ ์ค์ตํ๋ฉฐ ํ์ธ
- ๋ด์ฉ ์ ๋ฆฌ : ํ์ต ๋ด์ฉ์ ์ ๋ฆฌํ์ฌ ๋ง๋ฌด๋ฆฌ
๊ฐ์ ๋ด์ฉ์ ๋ฏธ๋ฆฌ ํ์ธํด ๋ณด์ธ์ ๐
๊ธฐ์ด ์ด๋ก ์ค๋ช
ํ์ตํ ๋ด์ฉ ์ค์ต
๋ด์ฉ ์ ๋ฆฌ
๊ฐ์ ๋ชฉํ ๐
์ด ๊ฐ์๋ฅผ ๋ค์ผ๋ฉด ์ฌ๋ฌ๋ถ์ ์ด๋ฐ ๋ชจ์ต์ผ๋ก ๋ณํํ ์ ์์ด์!
๐๐ป ์น๊ฐ๋ฐ ๋ถ์ผ์์ HTML์ ์ญํ ์ด ๋ฌด์์ธ์ง ์ดํดํ ์ ์์ด์.
๐๐ป HTML์ด ์ผํ๋ ๋ฐฉ์์ ๋ํด ์ดํดํ ์ ์์ด์.
๐๐ป HTML์ ๊ธฐ๋ณธ ๋ฌธ๋ฒ๊ณผ ์์ฑ ๋ฐฉ๋ฒ์ ์ตํ๋ณผ ์ ์์ด์.
์ด ๊ฐ์๋ง์ ํน์ง
์
๋ฌธ์ ๋ถ๋ค์ด ๋ถ๋ด๊ฐ์ ๋๋ผ์ง ์๊ณ ๋น ๋ฅด๊ฒ ๊ณต๋ถํ์ค ์ ์๋๋ก ํ๊ธฐ ์ํด, ๊ผญ ํ์ํ ์ฃผ์ ๊ฐ๋
์์ฃผ๋ก ๋ด์ฉ์ ๊ตฌ์ฑํ์ด์. ๊ทธ๋์ ์ด ๊ฐ์๋ง์ผ๋ก HTML ์ฝ๋ ์์ฑ์ ํ์ํ ๋ฅ๋ ฅ์ ๊ฑฐ์ ๋ค ๊ฐ์ถ์ค ์ ์์ ๊ฑฐ์์. ์ด ๊ฐ์, ๋ฏฟ๊ณ ์๊ฐํด์ฃผ์ธ์! ๐
์ด๋ฐ ๋ด์ฉ์ ์๋ ค๋๋ ค์! ๐
HTML ๊ธฐ์ด of ๊ธฐ์ด
HTML์ ๊ธฐ์ด ์ ์์ ๊ฐ๋ฐ์ ๋๊ตฌ, ์ฝ๋ ์๋ํฐ ํ์ฉ๋ฒ, HTML ํต์ฌ ๊ธฐ์ด ๋ฌธ๋ฒ ๋ฑ
HTML์ ๋ํ ๊ฐ์ฅ ํ์์ ์ธ ๊ธฐ๋ณธ ์ง์์ ์๋ ค๋๋ฆฝ๋๋ค.
HTML ๋ฌธ์ ๊ธฐ๋ณธ ๊ตฌ์กฐ
<!DOCTYPE html>, <head>. <body> ๋ฑ HTML์ ํต์ฌ ๊ณจ๊ฒฉ์ ๋ํด ๊ณต๋ถํฉ๋๋ค.
HTML ํ๊ทธ ์์ ์ ๋ณต - ๊ธฐ๋ณธ
ํ
์คํธ ํ๊ทธ, ์ธ๋ผ์ธ ํ
์คํธ ์์, ๋งํฌ ํ์, ๋ชฉ๋ก ํ์ ๋ฑ
์น ํ์ด์ง ๋ด ๋ค์ํ ์์๋ฅผ ๊ตฌํํ๋ ๋ฐฉ๋ฒ์ ์์๋ด
๋๋ค.
HTML ํ๊ทธ ์์ ์ ๋ณต - ์ฌํ
์๋ฒ์ ํด๋ผ์ด์ธํธ๋ฅผ ํ์ฉํ ๋ฐ์ดํฐ ์ ์ก, ์น ๋ฌธ์์ ๋ํ ์ ๋ณด๋ฅผ ํ์ํ๋ ๋ฉํํ๊ทธ,
๋ค์ํ ๊ธฐ๊ธฐ๋ก ํ๋ฉด์ ๋ณผ ์ ์๋ viewport ๋ฑ์ ๋ํด ๊ณต๋ถํฉ๋๋ค.
์๊ฐ ์ ์๋ด ์ฌํญ์ ํ์ธํ์ธ์ ๐
๋ค์๊ณผ ๊ฐ์ ์ค๋น๋ฌผ์ ์ฑ๊ฒจ์ฃผ์ธ์!
๐ป ์ปดํจํฐ
๐ป ์ฝ๋ ์๋ํฐ (Visual Studio Code)
๐ป ์ํ ๋ฅ๋ ฅ (์๋๊ฐ ๋๋ ค๋ ๊ด์ฐฎ์์)
์๊ฐ ์ ๋ฏธ๋ฆฌ ์๋ ค๋๋ ค์!
๋๋ถ๋ถ์ ์์์๋ ์ฝ๋๋ฅผ ์์ฑํ๋ ์ฅ๋ฉด์ด ๋ฑ์ฅํ๋๋ฐ, ์์นซ ์์์ด ์ง๋ฃจํด์ง ์ ์๋ค๊ณ ํ๋จํด ๋๋ถ๋ถ ๋ฐฐ์ ์ฒ๋ฆฌ๋ฅผ ํ์์ต๋๋ค. ๋ฐ๋ผ์ ์ฝ๋ฉ ์ค์ต์ ๋ฐ๋ผํ์๋ ๊ฒฝ์ฐ ์ผ์์ ์ง ๊ธฐ๋ฅ์ ์ ์ ํ ํ์ฉํด ๊ฐ์๋ฉด์ ์ค์ต์ ์งํํ์๊ธธ ์ถ์ฒํฉ๋๋ค!