์ผ | ์ | ํ | ์ | ๋ชฉ | ๊ธ | ํ |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 |
- Java
- ๊น๋ฏธ๊ฒฝ์๋งํ์์
- ์๋ฐ
- ์นํผ๋ธ๋ฆฌ์ฑ
- ๋ง์ผ๋ด๊ฐ์ธ์์๋ค์์ฐ๋ค๋ฉด
- ํ๋ก๊ทธ๋๋ฐ
- ๋ฐ์ดํฐ๋ฒ ์ด์ค
- ์ปดํจํฐ๊ณผํ
- ๋ ์
- ๊น๋ฏธ๊ฒฝ
- ๋ผํ๋ผ์ค์๋ง๋
- ์๋ฐ์คํฌ๋ฆฝํธ
- ComputerScience
- ์ํ
- html
- K๋ฐฐํฐ๋ฆฌ๋ ๋ณผ๋ฃจ์
- Python
- ํ์ด์ฌ
- ์ฝ๋ฉ
- ์ค๋ผํด
- ๋ฐ์ํ
- ๊ฐ๋ฐ
- ์ฅํธ์์ค
- ์ฑ
- ์นํ์ด์ง๋ง๋ค๊ธฐ
- JavaScript
- database
- K๋ฐฐํฐ๋ฆฌ
- css
- ๊นํ๋จ
- Today
- Total
๋ชฉ๋กhtml (4)
JiYoung Dev ๐ฅ
![](http://i1.daumcdn.net/thumb/C150x150.fwebp.q85/?fname=https://blog.kakaocdn.net/dn/cOK5q5/btr2m1JBFrz/vqJfk04VR8wK11eP6RyMsK/img.png)
2023.03.06 ์ฝ๋์ ํ์ต ๋ด์ฉ ๐ HTML (Hypertext Markup Language) - Hypertext(ํ์ดํผํ ์คํธ) : ์๋ก ๋งํฌ๋ก ์ฐ๊ฒฐ๋ ๋ฌธ์ - Markup Language(๋งํฌ์ ๋ญ๊ท์ง) : ๋งํฌ์ ํ๋ ํ๋ก๊ทธ๋๋ฐ ์ธ์ด → mark something up : ํ์ํ๋ค โถ ๋ด์ฉ์ ์ถ๊ฐ์ ์ธ ์ ๋ณด๋ฅผ ํ์ํ๋ ํ๋ก๊ทธ๋๋ฐ ์ธ์ด - ์ฆ, ๋งํฌ๋ก ์ฐ๊ฒฐ๋ ๋ฌธ์๋ฅผ ๋ง๋ค ๋ ์ฌ์ฉํ๋, ๋ด์ฉ๋ฟ๋ง ์๋๋ผ ๋ฌธ์์ ๊ตฌ์กฐ์ ์๋ฏธ(h1, p, button ๋ฑ)์ ๊ฐ์ ์ถ๊ฐ์ ์ธ ์ ๋ณด๊น์ง ํ์ํ๋ ํ๋ก๊ทธ๋๋ฐ ์ธ์ด ๐ HTML์ ๊ธฐ๋ณธ ๋ฌธ๋ฒ ... ๋ด์ฉ html์ ํ๊ทธ๋ก ์์ฑ ํ๊ทธ๋ ๊ธฐํธ๋ก ๊ฐ์ธ์ ธ ์์ ์์ํ๊ทธ, ์ข ๋ฃํ๊ทธ ์์..
![](http://i1.daumcdn.net/thumb/C150x150.fwebp.q85/?fname=https://blog.kakaocdn.net/dn/blmEkf/btr116qtYu4/6S3Goan7VAiYE6r1ETuqLk/img.png)
์ด์ CSS ํต์ฌ ๊ฐ์๋ฅผ ๋ค ๋ฃ๊ณ ์ค๋ ๋ด๊ฐ ๋ง๋ ์นํ์ด์ง์ ์คํ์ผ์ ์ ํ๋ณด์๋ค. ์นด์นด์ค์ค๋ธ์ผ๋ก ๋ง๋ ์คํ ๋ฆฌ๋ณด๋ ๋์์ธ์ ๊ธฐ๋ณธ์ผ๋ก ํ์ผ๋, ํฐํธ ํฌ๊ธฐ๋ ์ฌ๋ฐฑ ๋ฑ์ ์์๋ก css๋ก ์ง์ ์ฝ๋ฉ์ ํด๋ณด๋ฉด์ ์ ๋นํ๊ฒ ์กฐ์ ํ์๋ค. ๐ css ์ฝ๋ ์์ฑ ๊ฒฐ๊ณผ ๊ฐ๋จํ ์นํ์ด์ง๋ผ์ ๋์ผํ ๋์์ธ์ ๊ตฌ์กฐ๊ฐ ๋ง์ ์์ฑ์ด ์ด๋ ต์ง ์์๋ค. ์์ฑํ๋ฉด์ ๋ชจ๋ฅด๋ ๋ถ๋ถ์ ๊ตฌ๊ธ๋ง์ ํตํด ํด๊ฒฐํ์๊ณ , ๊ทธ ๋ด์ฉ์ ์๋์ ๊ฐ๋ค. ๐ Div ํ๊ทธ ์ค์์ ์ ๋ ฌํ๊ธฐ Div ํ๊ทธ์ Width๋ฅผ ์ค์ ํ๊ณ margin ์ค๋ฅธ์ชฝ, ์ผ์ชฝ ๊ฐ์ auto๋ก ์ค์ โผ html ์ฝ๋ โผ โผ CSS ์ฝ๋ โผ ๐ ํ ์ค ๋ฌธ์ฅ ์์ชฝ ์ ๋ ฌํ๊ธฐ ํ ์ค์ง๋ฆฌ ๋ฌธ์ฅ์ ์์ชฝ ์ ๋ ฌํ๊ณ ์ถ์ด text-align: justify๋ฅผ ์ ์ฉํ์ง๋ง ์ ์ฉ๋์ง ์์์. ์ฌ๋ฌ ์ค์ผ ๊ฒฝ์ฐ์๋ ์ ๋ ฌ..
![](http://i1.daumcdn.net/thumb/C150x150.fwebp.q85/?fname=https://blog.kakaocdn.net/dn/8Gis9/btr1lvTiJ4a/rZjxYIL3rKsA9DCIMuKiwK/img.png)
์ด์ ๊ฐ๋จํ๊ฒ ์คํ ๋ฆฌ๋ณด๋๋ฅผ ๋ง๋ค์๊ณ , ์ค๋์ ๋ง๋ ์คํ ๋ฆฌ๋ณด๋๋ฅผ ๋ณด๋ฉด์ HTML ์ฝ๋๋ฅผ ์์ฑํด ๋ณด์๋ค. ์์ง HTML ๊ธฐ์ด ๊ณผ์ ๋ง ๋ฐฐ์ดํฐ๋ผ ๋ฒํผ์ด๋ ์ธํ, ํ ์ด๋ธ ๋ฑ ์๋ฐฐ์ด ๊ฒ๋ค์ด ์์์ง๋ง ์๋ฐฐ์ด ๋ด์ฉ๋ค์ ๊ตฌ๊ธ๋ง์ด๋ ๊ธฐํ ์ฌ์ดํธ์ ๊ฐ๋ฐ์ ์ฝ์์ ํ์ฉํด ์ฝ๋๋ฅผ ๋ฐ๋ผํ๋ฉฐ ๋ฃ์์ผ๋ฉฐ ์์ผ๋ก ๋ฐฐ์๋๊ฐ๋ฉด์ ์ฐจ์ฐจ ์๋ง๊ฒ ์์ ํ๊ณ ์ ํ๋ค. ์ค๋๊น์ง ์์ฑํ ์ฝ๋๋ ์คํ์ผ์ ํ๋๋ ๋ค์ด๊ฐ ์์ง ์์ ์ฝ๋์ด๋ฉฐ, ์คํ์ผ์ ๋ด์ผ ์ ์ฉํด๋ณผ ๊ณํ์ด๋ค. ์ด๋ ๊ธฐ๋ก ์นํ์ด์ง ๋ง๋ค๊ธฐ : ๊ธฐํ ํฌ์คํ [์ด๋ ๊ธฐ๋ก ์นํ์ด์ง ๋ง๋ค๊ธฐ] ๊ธฐํ (2023.03.01) ํ๋ก๊ทธ๋๋ฐ ๊ณต๋ถ๋ฅผ ์์ํ๊ณ ๋์ ๋ง๋๋ ๋์ ์ฒซ ์นํ์ด์ง. ์ฌ์ค ํ์ด์ฌ ์๊ณ ๋ฆฌ์ฆ ๊ฐ์๋ฅผ ๋ฃ๋ค๊ฐ ์ด๋ ต๊ธฐ๋ ํ๊ณ ํฅ๋ฏธ๋ ์ค์ด๋ค๊ณ ๊ทธ๋์ CSS์ HTML ๊ณต๋ถ๋ฅผ ๊ฐ์ด ์์ํ๋ฉฐ ๋๋ง์ ์นํ..
![](http://i1.daumcdn.net/thumb/C150x150.fwebp.q85/?fname=https://blog.kakaocdn.net/dn/JHVPg/btr0WeDQUri/bPU8o0qbIpFsd9AwDGW901/img.png)
๐ HTML, CSS๋? HTML, CSS๋ ์น์ฌ์ดํธ๋ฅผ ๋ง๋๋ ํ๋ก๊ทธ๋๋ฐ ์ธ์ด(์ปดํจํฐ ํ๋ก๊ทธ๋จ์ ๋ง๋ค ๋ ์ฌ์ฉํ๋ ์ธ์ด) ์์ค ์ฝ๋ : ํ๋ก๊ทธ๋๋ฐ ์ธ์ด๋ก ์์ฑํ ๋ด์ฉ ์ฝ๋ฉ ํ๋ค : ํ๋ก๊ทธ๋๋ฐ ์ธ์ด๋ก ์ฝ๋๋ฅผ ์์ฑํ๋ค. HTML์ ์น์ฌ์ดํธ์ ๋ค์ด๊ฐ๋ ๋ด์ฉ์ ๋ด๋นํ๊ณ , CSS(Cascading Style Sheets)๋ ์น์ฌ์ดํธ์ ๋ค์ด๊ฐ ์คํ์ผ์ ๋ด๋น ์น์ฌ์ดํธ๋ฅผ ๋ง๋ค ๋๋ ๊ธฐ๋ณธ์ ์ผ๋ก .html ํ์์ ํ์ผ์ ๋ง๋ฆ. HTML ํ์ผ์ ํธ์งํ ๋ค์์ ์น ๋ธ๋ผ์ฐ์ ์์ ์ด๋ฉด ์ฐ๋ฆฌ๊ฐ ํ์์ ๋ณด๋ ์น์ฌ์ดํธ์ฒ๋ผ ํ๋ฉด์์ ๋ณผ ์ ์์. HTML ํ์ผ์ ์์ฑํ๊ธฐ ์ํด VS Code๋ฅผ ์ฌ์ฉํ๊ณ , ์น ๋ธ๋ผ์ฐ์ ๋ก๋ ํฌ๋กฌ์ ์ฌ์ฉํ์ฌ ์น์ฌ์ดํธ๋ฅผ ๋ง๋ค์ด ๋ณผ ์์ . ๐ HTML ํ์ผ ๋ง๋ค๊ณ ์คํํด๋ณด๊ธฐ ๐ ํ๊ทธ(Tag) HTML์์ ํ๊ทธ๋ ..