Blog Page ํฌ์คํธ ๋ชฉ๋ก๋ฐ์ค ๋ฅ๊ทผ๋ชจ์๋ฆฌ๋ก ๋ฐ๊พธ๊ธฐ + ๊ทธ๋ฆผ์ํจ๊ณผ
๊ทธ์ ์ด์ ๋ ๊ทธ๋ฅ Blog Page ํฌ์คํธ ๋ชฉ๋ก ๋ชจ์์ด ์ฌ๋ ๊ฑฐ์ฌ๋ ค์ ๋ผ์ด์ง ์ฝ๋๋ฅผ ๋ง๋ค์ด๋ณด์ ํด์ ์๋๋ฅผ ํด๋ณด์์ต๋๋ค. ์๋๋ css ์์ค์ฝ๋์
๋๋ค. ๋ชจ๋ฐ์ผ์์ ๋ณต๋ถํ๋ ๋ญ๊ฐ ์ ์๋๋๊ตฐ์. ์์ธํ ๋ด์ฉ์ ํฌ์คํธ๋ฅผ ํ์ธํด๋ณด์ธ์. ์๋ํ๋ ์ค ๊พธ๋ฏธ๊ธฐ ์ฌ๋ฏธ๊ฐ ์๋ค์. https://secondlife.lol/wordpress-blog-rounded-corners/ /* ๊ฐ๋ณ ํฌ์คํธ ๋ฐ์ค๋ฅผ ๋ฅ๊ธ๊ฒ ์ค์ ํ๊ณ , ๋ด์ฉ์ด ๋์น์ง ์๋๋ก ์ฒ๋ฆฌ */ .post { border-radius: 10px; /* ๋ชจ์๋ฆฌ๋ฅผ ๋ฅ๊ธ๊ฒ ๋ง๋ฆ (10px ๊ณก๋ฅ ) */ overflow: hidden; /* ๋ด์ฉ์ด ๋ฐ์ค ๊ฒฝ๊ณ์ ์ ๋์ด๊ฐ์ง ์๋๋ก ์ค์ */ box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* ๋ฐ์ค์ ๋ถ๋๋ฌ์ด ๊ทธ๋ฆผ์๋ฅผ ์ถ๊ฐ (0px X์ถ, 4px Y์ถ, 8px ํผ์ง) */ transition: all 0.3s ease-in-out; /* ๋ชจ๋ ์คํ์ผ ๋ณ๊ฒฝ์ ๋ถ๋๋ฝ๊ฒ 0.3์ด ๋์ ์ฒ๋ฆฌ */ } /* ํฌ์คํธ ๋ฐ์ค์ ๋ง์ฐ์ค๋ฅผ ์ฌ๋ ธ์ ๋์ ์คํ์ผ */ .post:hover { transform: scale(1.02); /* ๋ฐ์ค ํฌ๊ธฐ๋ฅผ ์ฝ๊ฐ ํ๋ (1.02๋ฐฐ) */ box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15); /* ๊ทธ๋ฆผ์๋ฅผ ๋ ๋๋ ทํ๊ฒ ๋ณ๊ฒฝ (6px Y์ถ, 12px ํผ์ง) */ }