์ธํŒŒ

You Can Become A

๋Šฆ๊ฒŒ ์‹œ์ž‘ํ•ด๋„ ๋ˆ„๊ตฌ๋“ ์ง€ ๋…ธ๋ ฅํ•˜๋ฉด ๊ฐœ๋ฐœ์ž๊ฐ€ ๋ ์ˆ˜ ์žˆ์–ด์š” !

last-child

๊ณต๋ถ€ํ•œ ๋‚ด์šฉ์„ ์ •๋ฆฌํ•ฉ๋‹ˆ๋‹ค
CSS

๐ŸŒŸ first-child / first-of-type ์†์„ฑ ์ฐจ์ด์ 

first-child ์™€ first-of-type ์ฐจ์ด์  first-child ์™€ first-of-type์€ ๋˜‘๊ฐ™์ด ์ž์‹ ํ˜•์ œ ์š”์†Œ ๊ณ ๋ฅด๋Š”๊ฒƒ๊ฐ™์€๋ฐ ๋ฌด์—‡์ด ๋‹ค๋ฅผ๊นŒ? ํ•œ๋ฐฉ์— ์ดํ•ดํ•˜๊ธฐ ์‰ฝ๊ฒŒ ๊ฐ„๋‹จ๋ช…๋ฃŒํ•˜๊ฒŒ ์„ค๋ช…ํ•˜๋ฉด ์ด๋ ‡๋‹ค. div > p:first-child 'div ํ•˜์œ„์˜ p ์š”์†Œ ์ค‘ ์ฒซ๋ฒˆ์งธ ์š”์†Œ' ๋กœ ์ฝ๋Š” ๊ฒŒ ์•„๋‹ˆ๋ผ 'div ํ•˜์œ„์˜ ์ฒซ๋ฒˆ์งธ ์ž์‹์ธ ์š”์†Œ๊ฐ€ p ์š”์†Œ' ์ด๋ฉด์ด๋‹ค. ์ฆ‰, div์˜ ์ž์† ์š”์†Œ์ค‘์— first-child๋ฅผ ๊ณ ๋ฅด๋Š”๋ฐ ๊ทธ๊ฒŒ p์ด๋ฉด ์Šคํƒ€์ผ์„ ์ ์šฉํ•œ๋‹ค. ๋งŒ์ผ p๊ฐ€ ์—†๋‹ค๋ฉด ์Šคํƒ€์ผ์„ ์ ์šฉํ•˜์ง€ ์•Š๋Š”๋‹ค. 'div first-child is p' ๋ผ๊ณ  ์˜์–ด ๋ฌธ์žฅ์œผ๋กœ ์ดํ•ดํ•˜๋ฉด ๋œ๋‹ค. .parent > span:first-child { background: lightgreen; } .parent2 > p:fi..

category_image
์ธํŒŒ_
2023.04.20
2