์ด๋ฏธ์ง์ ํ2 ์น์ฌ์ดํธ ๋ง๋ค๊ธฐ : ์ด๋ฏธ์ง ์ ํ ๋ ์ด์์02 ๋ ์ด์์ : ์ด๋ฏธ์ง ์ ํ02 ๋ค์๊ณผ ๊ฐ์ ์ด๋ฏธ์ง ์ ํ์ ๋ ์ด์์์ ์์ ํด ๋ณด๋๋ก ํ๊ฒ ์ต๋๋ค. ์ด๋ฒ์๋ ์ด๋ฏธ์ง๊ฐ ์ด ์ธ ๊ฐ์ด๋ฉฐ, ์ด๋ฏธ์ง ์์ ๋ง์ฐ์ค๋ฅผ hoverํ๋ฉด '์์ธํ ๋ณด๊ธฐ' ๋ฒํผ์ด ๋ํ๋๋ CSS ์์๋ ์ถ๊ฐํ์์ต๋๋ค. HTML ์์ค ๋จผ์ , ์ธ ๊ฐ์ article ํ๊ทธ๋ฅผ ๋ง๋ค์ด ๊ฐ๊ฐ ์ด๋ฏธ์ง๋ฅผ ์ฒจ๋ถํด ์ฃผ์์ต๋๋ค. article ํ๊ทธ ์์์๋ image ๋ถ๋ถ๊ณผ desc ๋ถ๋ถ์ ๋๋์ด ์์ ํด ์ฃผ์์ต๋๋ค. ๋ฐ๋ค์ ์ฌ๋ ์๋ฌผ๋ค ๋ฐ๋ค์๋ ์ด๋ค ์๋ฌผ๋ค์ด ์ด๊ณ ์์๊น์? TTUNG-E ์์ธํ ๋ณด๊ธฐ JingJing-E ์์ธํ ๋ณด๊ธฐ Jibgeo-Sajang ์์ธํ ๋ณด๊ธฐ CSS ์์ค ํฐํธ๋ ์ง๋ง์ผ ์ฐ์ค๋ฅผ ์ฌ์ฉํ์๊ณ , display: flex๋ฅผ ์ด์ฉํ์ฌ ์ธ ๊ฐ์ ์ด๋ฏธ์ง๋ฅผ ๊ฐ๋ก๋ก ๋ฐฐ์นํ์์ต๋๋ค. overflow-hidde.. 2022. 8. 17. ์น์ฌ์ดํธ ๋ง๋ค๊ธฐ : ์ด๋ฏธ์ง ์ ํ ๋ ์ด์์01 ๋ ์ด์์ : ์ด๋ฏธ์ง ์ ํ01 ๋ค์๊ณผ ๊ฐ์ ์ด๋ฏธ์ง ์ ํ์ ๋ ์ด์์์ ์์ ํด ๋ณด๋๋ก ํ๊ฒ ์ต๋๋ค. HTML ์์ค ์นด๋ ์ ํ๊ณผ ์ ์ฌํ๊ฒ, ๋ ๊ฐ์ ์นด๋๋ฅผ ๋ง๋ค์ด ์ด๋ฏธ์ง๋ฅผ ๋ฐฑ๊ทธ๋ผ์ด๋ ๋ฐฉ์์ผ๋ก ์ฝ์ ํ์ต๋๋ค. ์น ํ์ค ์ค์๋ฅผ ์ํด, a ํ๊ทธ์๋ title์ ์ถ๊ฐํด ์ฃผ์์ต๋๋ค. ์ธ์์ ๊ท์ฌ์ด ๋๋์ด ๊ฐ์์ง ์ข ๋ฅ๋ ๋งค์ฐ ๋ค์ํฉ๋๋ค. ํ์ง๋ง ํ๋๊ฐ์ด ์ ๋ง ๊ท์ฝ์ต๋๋ค. ์ธ์์ ๊ท์ฌ์ด ๋๋์ด ๋๊ฐ ๋ญ๋๋ ๋๋์ด๋ ์ฐธ ๊ท์ฝ๋ค. ์ ๋๋ ๋๋์ด๊ฐ ์์๊น? ์์ธํ ๋ณด๊ธฐ ์ธ์์ ๊ท์ฌ์ด ๋๋์ด ๋๊ฐ ๋ญ๋๋ ๋๋์ด๋ ์ฐธ ๊ท์ฝ๋ค. ์ ๋๋ ๋๋์ด๊ฐ ์์๊น? ์์ธํ ๋ณด๊ธฐ CSS ์์ค ํฐํธ๋ ๋ฅ์จ Lv1 ๊ณ ๋์ ์ฌ์ฉํ์๊ณ , display: flex๋ฅผ ์ด์ฉํ์ฌ ๋ ๊ฐ์ ์ด๋ฏธ์ง๋ฅผ ๊ฐ๋ก๋ก ๋ฐฐ์นํ์์ต๋๋ค. /* fonts */ @import url.. 2022. 8. 17. ์ด์ 1 ๋ค์ 728x90 ๋ฐ์ํ