HTML & CSS ๐/CSS ์ฐ์ต(4)
-
1์ผ์ฐจ nth-child ๊ตฌ์กฐ ์ ํ์
nth-child(2n+1) : ํ์๋ง ์ ํ nth-child(2n) : ์ง์๋ง ์ ํ first-child: ์ฒซ ๋ฒ์งธ๋ง ์ ํ last-child : ๋ง์ง๋ง๋ง ์ ํ English Korean Chinese French Spanish Japanese Irish ๊ฒฐ๊ณผ๋ฌผ
2020.10.26 -
1์ผ์ฐจ nth-child ๊ตฌ์กฐ ์ ํ์
nth-child(2n+1) : ํ์๋ง ์ ํ nth-child(2n) : ์ง์๋ง ์ ํ first-child: ์ฒซ ๋ฒ์งธ๋ง ์ ํ last-child : ๋ง์ง๋ง๋ง ์ ํ ul li:nth-child {} ์ด ์ฝ๋ฉ์ ํ ๋ ๋์ด์ฐ๊ธฐ ์๋ชปํ๊ฑฐ๋ ์คํ ๋ง์ด ํ๋ฆฌ๋ฉด ๊ฒฐ๊ณผ๊ฐ์ด ์ ์ ๋์ค๋ฏ๋ก ์ฃผ์ํ๋ค. ์๋ฌด๋๋ ๋์ด์ฐ๊ธฐ๋ฅผ ํ๋ฉด ์ ๋๋ ์ ์ฃผ์! English Korean Chinese French Spanish Japanese Irish ๊ฒฐ๊ณผ๋ฌผ
2020.10.26 -
1์ผ์ฐจ margin ๊ฐ์ด๋ฐ์ ๋ ฌ
margin: 0 0 0 0 ์๊ณ๋ฐฉํฅ์ผ๋ก ์,ํ,์ข,์ฐ๋ก ์ง์ ๊ฐ์ ์์น๋ฅผ ์ฃผ๋ ๊ฒ. margin: 30px, 0 ๋ก ํ๋ฉด ์, ํ๋ 30px๋งํผ ๋จ์ด์ง์ง๋ง, ์ข,์ฐ๋ 0px๊ฐ ๋๋ค. margin: 0, 500px, 30px, 0 ์ด๋ฐ ์์ผ๋ก ๋ฐ๋ก ๋ฐ๋ก ์ง์ ํ ์๋ ์๋ค. margin: 0 auto; ์ด๋ ๊ฒ ์ง์ ํ๋ฉด ํญ์ ์ฝํ ์ธ ๊ฐ ๊ฐ์ด๋ฐ ์ ๋ ฌ์ด ๋๋ค. ์น ํ์ด์ง์ ํฌ๊ธฐ์ ์๊ด ์์ด ๊ฐ์ด๋ฐ ์ ๋ ฌ์ด ๋๊ธฐ ๋๋ฌธ์ ๋งค์ฐ ์ค์ํจ. text-align: center; : ๊ธ์จ ๊ฐ์ด๋ฐ ์ ๋ ฌ em; : ๋ฐฐ์๋ก ํฌ๊ธฐ๋ฅผ ํค์ฐ๊ธฐ ์ฐธ์น๊น์น์ฐ๊ฐ ์ฌ๊ฒน์ด๋ณถ์๋ฐฅ ๊ตฌ์ด๋ญ๊ฐ๋น ์๊ฐ๋น์นํจ ์ค์ผ์ฒ ํ๋ณถ์ ๊ฒฐ๊ณผ๋ฌผ
2020.10.26 -
1์ผ์ฐจ CSS ๊ธฐ์ด background, border, font, hover
๊ธฐ๋ณธ์ ์ผ๋ก hover : ๋ง์ฐ์ค ์ปค์๋ฅผ ๋์์ ๋ ๊ธ์จ์ ์์์ด ๋ณ๊ฒฝ๋๋ค. ์ฌ์ ์ ๋ป์ ์์ฑ์ด๋ค, ๋งด๋๋ค ์ด๋ฐ ๋ป์ด๋ค ใ _ใ Maryable Day ์๋ ํ์ธ์. ๋ฉ๋ฆฌ์ด๋ธํ ํ๋ฃจ~ Maryable Day ์๋ ํ์ธ์. ๋ฉ๋ฆฌ์ด๋ธํ ํ๋ฃจ~
2020.10.26