๐ก๐ธ๐ธ๐ถ3:๐น๐๐๐๐๐๐๐น/๐ก๐ฅ๐ข๐ฃ:๐ป๐ฏ๐๐ฟ&๐๐ฎ๐ฎ (3) ์ธ๋ค์ผํ ๋ฆฌ์คํธํ [CSS] 1. ๊ธฐ๋ณธ๋ฌธ๋ฒ CSS : Cascading Style Sheet css๋ htmlํ์ผ์์ style, ์ฆ css ์ฝ๋ ์์ #id๋ฅผ ์ฐ๊ณ ์์ฑ์ ์ ์ํด์ฃผ๋ฉด ๋๋ค! ๊ทธ๋ฌ๋ฉด ์ด๋ ๊ฒ list ์ค ํ ๊ฐ์ ๋ฆฌ์คํธ์๋ง ์์ฑ์ ์ ์ฉํ ์ ์๋ค! +padding์ ์์ชฝ ๊ฐ๊ฒฉ, margin์ ๋ฐ๊นฅ์ชฝ ๊ฐ๊ฒฉ์ด๋ค. xml์ด๋ ๊ต์ฅํ ์ ์ฌํ๊ตฐ ์์ 3๋ ๊ตฌํํด๋ณด์ ์ํ์ฝ๋ฉ์ ์ธ๊ณ์ ์ค์ ๊ฒ์ ํ์ํฉ๋๋ค. ์ํ์ฝ๋ฉ์ ์ผ๋ฐ์ธ๋ค์๊ฒ ํ๋ก๊ทธ๋๋ฐ์ ์๋ ค์ฃผ๋ ๊ฒ์ ๋ชฉ์ ์ผ๋ก ํ๋ ๋น์๋ฆฌ ํ๋์ ๋๋ค. ๊ทธ๊ฐ ํ๋ก๊ทธ๋๋จธ๋ค์ด ์ด๋ฃฉํ ์ฑ์ทจ๋ฅผ ์ผ๋ฐ์ ์๋ ค์ ๊ณ ๋ ํ ํ๋ก๊ทธ๋๋จธ๋ค์ ๊ด๊ฐ์ ๋ชจ๊ฐํ๋ ํ๋์ด๊ธฐ๋ ํฉ๋๋ค. ์ํ์ฝ๋ฉ์ ์ธ ๊ฐ์ง๋ก ๊ตฌ์ฑ๋์ด ์์ต๋๋ค. ์จ๋ผ์ธ ๊ฐ์ ์ํ์ฝ๋ฉ์ ๊ฐ์๋ ์์ ๊ณผ ์ฌ์ ์ผ๋ก ๊ตฌ์ฑ๋์ด ์์ต๋๋ค. ์ ๋ฌธ์์ ๊ฐ์ฅ ํฐ ๊ณ ์ถฉ์ '๋ฌด์์ ๋ชจ๋ฅด๋์ง .. [HTML] 2. ์๋ฏธ๋ก ์ ์ธ ์น JavaScript๋? JavaScript๋? ๋ณ์์ ์์ ์ฐ์ฐ์ ๋ณ์์ ์์ ๋ณ์๋ ๋ณํ๋ ๊ฐ x=10์ผ ๋ ์ผ์ชฝํญ ์, ์ด ์ฝ๋๋ฅผ ๋๋ฆฌ๋ฉด ์๋กท๊ฒ ์ ๋์จ๋ค. ์ด๋ ๊ฒ ์ง๋ ๋์ง๋ง! ์ฐ๋ฆฌ๋ 1,2,3์ด ๋ฉ๋ด๋ผ๋ ๊ฒ์ ์ดํด์ํค๊ธฐ ์ํด, ๊ธฐ๋ฅ์ ์์ง๋ง ์ด ํ๊ทธ ์์ ์๋ ์ฝํ ์ธ ๊ฐ ์น์ฌ์ดํธ๋ฅผ ํ์ํ๋ navigation์์ ์๋ ค์ฃผ๋ ํ๊ทธ๋ฅผ ์ฌ์ฉํ ์ ์๋ค. ๋ํ JavaScript๊ฐ ์น์ฌ์ดํธ ์ ์ฒด๋ฅผ ์ค๋ช ํ๋ header์ ์ญํ ์ ํ๋ค๋ ๊ฒ์ ์๋ ค์ฃผ๋ JavaScript๋? JavaScript๋? ๋ณ์์ ์์ ์ฐ์ฐ์ ๋ณ์์ ์์ ๋ณ์๋ ๋ณํ๋ ๊ฐ x=10์ผ ๋ ์ผ์ชฝํญ ์๋ก์ฝ๋กฌ! [HTML] 1. HTML ๊ธฐ๋ณธ ๋ฌธ๋ฒ HTML = HyperText Markup Language ์ฌ๋๋ ์์๋ค์ ์ ์๊ณ , ์น ๋ธ๋ผ์ฐ์ ๋ ์์ ๋ค์ ์ ์๋ ์ธ์ด ํ์ดํผ ํ ์คํธ (๋งํฌ) ๋งํฌ๋ก ์ฐ๊ฒฐ๋ ๊ฑฐ๋ํ ์ ๋ณด ๋ฉ์ด๋ฆฌ = WEB ๋งํฌ๋ HTML์ ๋ณธ์ง, HTML์ ๋ณธ์ง์ ์น์ ๋ณธ์ง Markup Language - Tag (์์ํ๊ทธ, ๋ํ๊ทธ) ex) ๊ฐ์กฐ ex) ์๋ ํ์ธ์. ์ํ์ฝ๋ฉ ์ ๋๋ค. ์ฐธ๊ณ ) VS Code์์ open in browser๋ฅผ ๊น๊ณ htmlํ์ผ์ ์ฐํด๋ฆญ ํ ํ open with default browser๋ฅผ ๋๋ฅด๋ฉด HTML์ฝ๋๋ฅผ ๋ธ๋ผ์ฐ์ ๋ก ์ด์ด์ ํ์ธํ ์ ์๋ค. 1) a ํ๊ทธ = url, ๋งํฌ ์๋ ํ์ธ์. ์ํ์ฝ๋ฉ ์ ๋๋ค. href = ์์ฑ๋ช , ์ฝ์๋์ด ์์. (hypertext reference) href๋ก ์ฐ๊ฒฐํ u.. ์ด์ 1 ๋ค์