๐ฅ๏ธ ๋น์ ๊ณต ์ผ๋งคํ6 [ํฐ์คํ ๋ฆฌ] ๋๊ธ ์๋ฐํ(ํ๋กํ ์ด๋ฏธ์ง)๋ฅผ ๋ฐ๊ฟ๋ณด์ ๊ธฐ๋ณธ ์๋ฐํ ๋ณ๊ฒฝํ๊ธฐ ๊ธฐ๋ณธ ์๋ฐํ๋ ๋ญ์ง? ํฐ์คํ ๋ฆฌ๋ ๊ธฐ๋ณธ์ ์ผ๋ก ๋ก๊ทธ์ธ ์์ด ๋๊ธ ์์ฑ์ด ๊ฐ๋ฅํ๋ค. ๊ทธ๋ฐ๊ฒฝ์ฐ ์ด ๋ธ๋ก๊ทธ์ฒ๋ผ ๋๊ธ ์์ ์๋์ผ๋ก ํ๋กํ ์ด๋ฏธ์ง๊ฐ ๋๋คํ๊ฒ ๋ํ๋๋ค. ์์๋ฅผ ๋ณด์. ์ด๋ ๊ฒ ๊ธฐ๋ณธ ํ๋กํ ๋๋ค ์ด๋ฏธ์ง๊ฐ ๋ํ๋๋ค. ์ด 8๊ฐ์ง๋ก, ์ด๋ฒ์๋ ์ด ์ด๋ฏธ์ง๋ฅผ ๋ด ์ ๋ง์ ๋ง๊ฒ ๋ฐ๊พธ๋ ํฌ์คํ ์ด๋ค. ์ฐ์ ๋์ฒด ์ด๋ฏธ์ง๋ฅผ ์ฐพ์๋ณด์ ์์ฑ์ ํ์ธํ๊ณ ๋์ฒด ์ด๋ฏธ์ง๋ก ๊ฐ์๋ผ์ฐ๊ธฐ ์ํ ์์ ์ ์์ํด๋ณด์. ๊ฐ์ฅ ํํ ์ด๋ฏธ์ง ํ์ผ์ ์น์ํ JPG ๋๋ JPEG ์ด๊ฒ ์ง๋ง ์์ผ๋ก ๊ทธ๋ฐ ์ด๋ฏธ์ง๋ ๋ ์ ์๋ค๋ฉด ์ง์ํ์. ์ด๋ฐ ๋ ์๋ค์ ํ๋ํ๋ฉด ๋ชจ์์ดํฌ์ฒ๋ผ ๊นจ์ง๋ ๋ ์๋ค์ด๋ค. ์ก์ค์ ์ฌ๊ธฐ๊น์ง ํ๊ณ ์์ฑ์ ์ด๋ป๊ฒ ์์? ํฌ๋กฌ์ด๋ ์ฃ์ง๋... (์๋ ์ค๋ง ์ต์คํ๋ก๋ฌ ์ฐ๋์ฌ๋์ ์๊ฒ ์ง.....) ๊ธฐ๋ณธ์ ์ผ๋ก ํ๋ฉด์์ 'F12.. ๐ฅ๏ธ ๋น์ ๊ณต ์ผ๋งคํ/๐๏ธTISTORY 2023. 12. 7. [CODEPEN] ๋ธ๋ก๊ทธ์ ํ์ธ์ด ๋ฐ๋ก ํ์ธ๋๋ ์ฝ๋๋ฅผ ๋ฃ์ด๋ณด์ CODEPEN CODEPEN์ด ๋ญ๋ฐ? CODEPEN ์ด๋ผ๋ ํด์ด ์๋ค. ์ด๊ฒ ๋ฌด์์ธ๊ณ ํ๋ ์ฝ๋๋ฅผ ์์ฑํ๊ณ , ํด๋น ๋ด์ฉ์ ๋ฐ๋ก! ์ฆ์! ๋ณด์ฌ์ฃผ๋ ํด์ด๋ค. ๋ฌด๋ ค ๊ทธ ์ฝ๋๋ฅผ ๋ธ๋ก๊ทธ ๊ฐ์ ๊ณณ์ ๋ฐ๋ก ๋ณด์ฌ ์ค ์ ์๋ค. ์๋์ฒ๋ผ ๋ง์ด๋ค. HTML ์ฝ์ ๋ฏธ๋ฆฌ๋ณด๊ธฐํ ์ ์๋ ์์ค ์ ๊ธฐ๋ ํ์ ๋ผ... ์ฌ์ฉ๋ ์ฝ๋์ ๊ฒฐ๊ณผ๋ฅผ ํจ๊ป ๋ณด์ฌ ์ค ์ ์๋ ํด์ด๋ค. ๋ฌผ๋ก ์นํด์ด์ด์ ๊ฐ์ ์ด ๊ฐ๋ฅํ๋ค. ์์ฐธ. ์ฃผ์ ๋จผ์ https://codepen.io/ CodePen An online code editor, learning environment, and community for front-end web development using HTML, CSS and JavaScript code snippets, projects, and .. ๐ฅ๏ธ ๋น์ ๊ณต ์ผ๋งคํ/๐๏ธTISTORY 2023. 12. 5. [HTML 5] ์๋งจํฑ(Semantic) ํ๊ทธ ์๋ฉํฑ ํ๊ทธ(Semantic Tag) ์๋งจํฑ ํ๊ทธ๋ ์น ํ์ด์ง์ ๊ตฌ์กฐ์ ์๋ฏธ๋ฅผ ๋ช ํํ๊ฒ ํํํด์ฃผ์ด ๊ฒ์ ์์ง ์ต์ ํ(SEO)๋ฅผ ๋น๋กฏํ ์น ์ ๊ทผ์ฑ๊ณผ ๊ฐ๋ ์ฑ์ ํฅ์์ํจ๋ค.... ๋ผ๊ณ ํ๋ค. ๊ฐ๋จํ๊ฒ ์ด์ผ๊ธฐ ํ๋ฉด ์ ์ฒด body ์์ญ ์์์ ๊ฐ๊ฐ์ ์์ญ์ ์ง์นญํ๋ ํ๊ทธ... ๋ผ๊ณ ํ๋ฉด ๋ ์ง ๋ชจ๋ฅด๊ฒ ๋ค. ์๋ฏธ ํ๊ทธ๋ผ๋ ๋ป์ธ๋ฐ, ....์๋ฏธ ํ๊ทธ๋ผ๋ ์๋ฏธ ์ธ๋ฐ ใ ใ ๋ญ ์ด๋ ต๊ฒ ์๊ฐํ ๊ฑด ์๋ค. ๊ฐ๊ฐ ์ด๋์ ์์นํ๊ณ ์ํ๊ฒ ๋๋์ง๋ฅผ ์ค๋ช ํ๋ค๊ณ ๋ณด๋ฉด ๋ ๊ฒ ๊ฐ๋ค. header ํ๊ทธ๋ ์น ํ์ด์ง์ ์๋จ์, nav ํ๊ทธ๋ ๋ฉ๋ด๋ฅผ, article ํ๊ทธ๋ ๋ณธ๋ฌธ์, section ํ๊ทธ๋ ๊ตฌํ์ ์๋ฏธํ๋ค. ์ด๋ฅผ ์ ์ ํ ์ฌ์ฉํ๋ฉด ์น ํ์ด์ง์ ๊ตฌ์กฐ๋ฅผ ๋์ฑ ๋ช ํํ๊ฒ ํํํ ์ ์๋ค. ์ฆ ๊ตฌ์กฐ๋ฅผ ์ค๊ณ ํด๋๋ฉด, ์๋ฉํฑ ํ๊ทธ๋ฅผ ํ์ฉํด์ ์กฐ๊ธ๋.. ๐ฅ๏ธ ๋น์ ๊ณต ์ผ๋งคํ/๐น HTML 2023. 11. 28. [HTML 5] ํน์๋ฌธ์๋ฅผ ์ฌ์ฉํ์ HTML์ ํ๊ทธ๋ฅผ ์ฌ์ฉํ๋ค๋ณด๋ฉด ๋๋ ์๊ฐ์ด ์๋ค. ํน์ ๋ถ๋ฑํธ ๊ธฐํธ '>' ๋ ' ๐ฅ๏ธ ๋น์ ๊ณต ์ผ๋งคํ/๐น HTML 2023. 11. 14. [HTML 5] TAG.2 TAG์ ์ข ๋ฅ์ ๊ธฐ๋ฅ๋ค ํ๊ทธ์ ๊ธฐ๋ฅ๊ณผ ์ข ๋ฅ ๋ด๊ฐ ์ด๊ณณ์ ์ด๋ฐ ๊ธ์ ์ฐ๋ ๊ฒ์ ๋๊ตฌ๋ฅผ ๊ฐ๋ฅด์ณ ์ฃผ๊ธฐ ์ํ ๊ฒ์ ์๋๋ค. ๊ทธ๋ฅ ์ ๋ฒ ๋์ด๊ฐ ๋ ๋น์ ๊ณต์ ์์ ์จ์ ์ฝ๋ฉ์ ๋ฐฐ์ฐ๋ ์ฐ์ต์ฅ์ด๋ผ๊ณ ์๊ฐํด์คฌ์ผ๋ฉด ์ข๊ฒ ๋ค. ๊ทธ๋ฌ๋๊น ๋ฐ๋ง๋ก ์ง๊ป์ด๊ณ ์๋ ๋ถ๋ถ์ ์ดํดํด ์ฃผ์ จ์ผ๋ฉด ํ๋ค. ํ๋ฆฐ ๋ด์ฉ์ด ์์ฒญ ๋ง์ ์ ์์ด์ ์ง์ ์ ํด์ฃผ์ ๋ค๋ฉด ๊ฐ์ฌํ ๋ฐ์ ์์ ์ด๋ค. ์ผ๋จ ์ง๋๋ฒ์ 2023.10.13 - [๋ด์๋ด๊ธฐ/HTML5] - [HTML5.1 - ํ๊ทธ1] HTML5 ํ๊ทธ์ ๊ธฐ๋ณธ์์ [HTML5.1 - ํ๊ทธ1] HTML5 ํ๊ทธ์ ๊ธฐ๋ณธ์์ HTML์ ํ๊ทธ๋ก ์์ํด์ ํ๊ทธ๋ก ๋๋๋ค. ์ด์ ์ฒ์์ผ๋ก ์ฝ๋ฉ์ ๋ฐฐ์ฐ๋๋ฐ ๋ฌด์๋ถํฐ ํ ๊น ์์ฒญ๋ ๊ณ ๋ฏผ์ ํ๊ณ ์ํ์ฐฉ์ค๋ฅผ ๊ฑฐ์ณ ์ผ๋จ ํฐ์คํ ๋ฆฌ๋ฅผ ์ ๋ง์ ๋ง๊ฒ ๋ฐ๊พธ๋ ๋ฐฉ๋ฒ์ ์ฐพ์๋ณด๊ธฐ๋ก ํ๋ค. ์๋ cosmin-whale.tist.. ๐ฅ๏ธ ๋น์ ๊ณต ์ผ๋งคํ/๐น HTML 2023. 11. 9. [HTML 5] TAG.1 ํ๊ทธ์ ๊ธฐ๋ณธ์์ HTML์ ํ๊ทธ๋ก ์์ํด์ ํ๊ทธ๋ก ๋๋๋ค. ์ด์ ์ฒ์์ผ๋ก ์ฝ๋ฉ์ ๋ฐฐ์ฐ๋๋ฐ ๋ฌด์๋ถํฐ ํ ๊น ์์ฒญ๋ ๊ณ ๋ฏผ์ ํ๊ณ ์ํ์ฐฉ์ค๋ฅผ ๊ฑฐ์ณ ์ผ๋จ ํฐ์คํ ๋ฆฌ๋ฅผ ์ ๋ง์ ๋ง๊ฒ ๋ฐ๊พธ๋ ๋ฐฉ๋ฒ์ ์ฐพ์๋ณด๊ธฐ๋ก ํ๋ค. ์๋ ๋ด์ฉ์ ๋ณต๊ธฐ๋ฅผ ์ํ ๊ฒ์ผ๋ก ๋๊ตฌ๋ฅผ ๊ฐ๋ฅด์น ๊น๋ฅ์ด ์๋์ ์ฃ๋ค ํ๋ฆด๊ฑฐ๋ผ... ํ๋ ธ์์๋ ์๋ค. ์์์ HTML์ ๋ฐฐ์ฐ๋ ๊ฒ์ด์๋ค. ๋ญ๊ฐ ๋ญ์ง๋ ๋ชจ๋ฅด์ง๋ง ์์์ ์ด๋ ๋ค ํ์ฌ HTML์ HTML5๋ผ๊ณ ํ๋๋ผ. ์๋ฆฌ๋จผํธ๋ HTML์์ ํ๊ทธ์ ๋ด์ฉ์ ํฌํจํ ํ๋์ ๋ฌธ์์ด์ธ๋ฐ, ์์ ์๋ฆฌ๋จผํธ - ํ์ ์๋ฆฌ๋จผํธ ์์์ด๋ค. ์ด๋ฏธ SQL์ ํ๊ณ ์๋ ๋ด ์ ์ฅ์์ ๋ณด์๋ฉด ์ฟผ๋ฆฌ์ ์๋ธ์ฟผ๋ฆฌ์ ๋์ ๊ฐ๋ ์ด ๋ ๊ฒ ๊ฐ๋ค. ๊ธฐ๋ณธ ๊ฐ๋ ์ ์ด๋ ๋ค. ์์ ํ๊ทธ๋ฅผ ๋ฃ๊ณ ๋ก ๋ซ๋๋ค. ํ๊ทธ๋ก ๋๋ฌ์ธ์ธ ๋ด์ฉ์ด ๋ฌธ์์ด์ด๊ณ , ํ๊ทธ๋ ๊ฐ ๊ธฐ๋ฅ์ ๊ฐ๋๋ค. ๊ตฌ.. ๐ฅ๏ธ ๋น์ ๊ณต ์ผ๋งคํ/๐น HTML 2023. 11. 9. ์ด์ 1 ๋ค์