๋ณธ๋ฌธ ๋ฐ”๋กœ๊ฐ€๊ธฐ

prefers-reduced-motion1

CSS ํ…์ŠคํŠธ ๋„ค์˜จ์‚ฌ์ธ ๋งŒ๋“œ๋Š” ๋ฐฉ๋ฒ• CSS ํ…์ŠคํŠธ ๋„ค์˜จ์‚ฌ์ธ ๋งŒ๋“œ๋Š” ๋ฐฉ๋ฒ• ๋„ค์˜จ ํ…์ŠคํŠธ๋Š” ์›น ์‚ฌ์ดํŠธ์— ๋ฉ‹์ง„ ๋ฏธ๋ž˜์ ์ธ ๋Š๋‚Œ์„ ์ถ”๊ฐ€ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. CSS์™€ ์• ๋‹ˆ๋ฉ”์ด์…˜์„ ํ™œ์šฉํ•˜๋ฉด ๋‹ค์–‘ํ•œ ๋ฐฉ๋ฒ•์œผ๋กœ ํ…์ŠคํŠธ์— ๋น›๋‚˜๋Š” ํšจ๊ณผ๋ฅผ ์ ์šฉํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ์ด ํฌ์ŠคํŒ…์—์„œ๋Š” CSS ํ…์ŠคํŠธ ๋„ค์˜จ์‚ฌ์ธ ๋งŒ๋“œ๋Š” ๋ฐฉ๋ฒ•์„ ์†Œ๊ฐœํ•˜๊ณ ์ž ํ•ฉ๋‹ˆ๋‹ค. ํ…์ŠคํŠธ์— ๊ธ€๋กœ์šฐ ํšจ๊ณผ ์ถ”๊ฐ€ ๋จผ์ € ํ…์ŠคํŠธ์— ๊ธ€๋กœ์šฐ(๋น›๋‚˜๋Š”) ํšจ๊ณผ๋ฅผ ์ถ”๊ฐ€ํ•˜๋Š” ๋ฐฉ๋ฒ•๋ถ€ํ„ฐ ์•Œ์•„๋ณด๊ฒ ์Šต๋‹ˆ๋‹ค. ์ด๋ฅผ ์œ„ํ•ด์„œ๋Š” CSS์˜ text-shadow ์†์„ฑ์„ ์‚ฌ์šฉํ•ฉ๋‹ˆ๋‹ค. ๋‹ค์Œ๊ณผ ๊ฐ™์ด CSS๋ฅผ ์ž‘์„ฑํ•˜์—ฌ ๊ธ€๋กœ์šฐ ํšจ๊ณผ๋ฅผ ๋งŒ๋“ค ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. .neonText { color: #fff; text-shadow: 0 0 7px #fff, 0 0 10px #fff, 0 0 21px #fff, 0 0 42px #0fa, 0 0 82px #0fa, 0 0 92px.. 2023. 10. 7.