1. ์ฌ์ด๋ ๋ฉ๋ด hover ํจ๊ณผ ์ปค์คํ
[๊ธฐ์กด ๋ฉ๋ด] ๊ธฐ๋ณธ ๋ฉ๋ด๋ ๊น๋ํ๊ณ ์ด์์ง๋ง ๋๋ ๋คํฌ๋ชจ๋๋ฅผ ์ํด์ ๋์ ๋๋ ํจ๊ณผ๋ฅผ ์ฃผ๊ณ ์ถ์๋ค.๋ง์ฐ์ค ์ฌ๋ฆฌ๋ฉด ๊ธ์จ์์ด ๋ณํ๋ฉด์ ๊ธ์จ ์๋์ ๊ทธ๋ผ๋ฐ์ด์
๋ฐ๊ฐ ์๊ธฐ๋๋ก ์ปค์คํ
ํ๋ค. hELLO ์คํจ ๊ธฐ์ค/* ์ฌ์ด๋๋ฐ ํธ๋ฒ ๊ทธ๋ผ๋ฐ์ด์
๋ฐ ์ปค์คํ
(24.11.11) */#sidebar #category .tt_category ul li::after { width: 0%; height: 2px; position: absolute; transition: width 0.4s; background-color: #80D0C7; background-image: linear-gradient(90deg, #80D0C7 0%, #7e92eb 100%); ..
โก1. Main ์์ญ ์๋ ํฐ์คํ ๋ฆฌ ๊ธฐ์กด ์คํจ ํ์ฌ ์ปค์คํ
์ํฉ ์ ์ฒด ๋ทฐ Dark ๋ชจ๋ Light ๋ชจ๋ โ
์ค๋์ ๋ช
์ธ(๋๋ค๋ช
์ธ) ์ฝ์
๋ช
์ธ์ ํผ์์ผ๋ HTML/CSS๋ ์ง์ ์ปค์คํ
ํจโ
Header ์ด๋ฏธ์ง ๋ณ๊ฒฝ๋ณ๊ฒฝ์ ๊ธฐ์กด์๋ ํ๋กํ ์ฌ์ง์ด ๋ฐํฌ๋ช
ํจ๊ณผ ์ ์ฉ๋์ด ๋ฉ์ธ ํค๋ ๋ถ๋ถ์ ๋์์ง. ๋ณ๊ฒฝํ๊ณ ์์ด ์ด๋ฏธ์ง๋ก ๋ณ๊ฒฝ ํด ์ฃผ๊ณ border-radius โ
์๋จ์ Navigation Bar ์ฝ์
ํค๋ ์ปค์คํ
์ด ๋๋๊ณ ๋๋ ๋ชจ๋ฐ์ผ ํ๋ฉด์์๋ Side๋ฐ์ hidden์ด๋ผ ์นดํ
๊ณ ๋ฆฌ๋ช
์ด ์ ๋ฌ๋ค.๊ทธ๋์ ์๋จ์ ๋ค๋น๊ฒ์ด์
๋ฐ๋ฅผ ๋ฌ์์ฃผ๊ธฐ๋ก ํ๋ค. ๋ณ๊ฒฝ ํ - `Home`, `Algorithm`, `Coding`, `ETC.`, `Visitor` ํญ Navigation Bar ๋ฌ์์ค- hover ํ๋ฉด ๊ทธ๋ฆผ์ ์๊ธฐ๊ณ , ํฐ..