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

์š”์†Œ์ˆจ๊ธฐ๊ธฐ1

[CSS] ์š”์†Œ๋ฅผ ์ˆจ๊ธฐ๋Š” ๋ฐฉ๋ฒ• CSS : ์š”์†Œ(element)๋ฅผ ์•ˆ๋ณด์ด๊ฒŒ ํ•˜๋Š” ๋ฐฉ๋ฒ• CSS ์†์„ฑ์„ ์ž‘์—…ํ•˜๋‹ค ๋ณด๋ฉด ์š”์†Œ๋ฅผ ์ˆจ๊ฒจ์•ผ ํ•˜๋Š” ์†์„ฑ๋“ค์ด ํ•„์š”ํ•˜๊ฒŒ ๋ฉ๋‹ˆ๋‹ค. ์ด๋ฒˆ ์‹œ๊ฐ„์—๋Š” CSS ๊ธฐ๋ฒ• ์ค‘ ํ•˜๋‚˜์ธ ์š”์†Œ๋ฅผ ์•ˆ๋ณด์ด๊ฒŒ ํ•˜๋Š” ๋ฐฉ๋ฒ• 5๊ฐ€์ง€์— ๋Œ€ํ•ด ์•Œ์•„๋ณด๊ฒ ์Šต๋‹ˆ๋‹ค!๐Ÿ˜„ #1. display : none; ๊ฐ€์žฅ ๋ณดํŽธ์ ์œผ๋กœ ์‚ฌ์šฉํ•˜๋Š” ์†์„ฑ ์ค‘ ํ•˜๋‚˜๋กœ ์š”์†Œ์˜ ์˜์—ญ์ด ์™„์ „ํžˆ ์‚ฌ๋ผ์ง€๊ฒŒ ๋ฉ๋‹ˆ๋‹ค. ๋˜ํ•œ ์ด ์†์„ฑ์„ ์‚ฌ์šฉํ•˜๊ฒŒ ๋˜๋ฉด ์• ๋‹ˆ๋ฉ”์ด์…˜ ํšจ๊ณผ๋„ ์ค„ ์ˆ˜ ์—†๊ฒŒ ๋ฉ๋‹ˆ๋‹ค. ๐Ÿ’ก ์ฝ”๋“œ ๋ณด๊ธฐ p {display : none;} ์—†์–ด์ง‘๋‹ˆ๋‹น ๋พฐ๋กœ๋กฑ #2. opacity: 0; opacity๋Š” ํˆฌ๋ช…๋„๋ฅผ ์„ค์ •ํ•˜๋Š” ์†์„ฑ ์ค‘ ํ•˜๋‚˜๋กœ ์š”์†Œ์˜ ํˆฌ๋ช…๋„๋ฅผ 0์œผ๋กœ ํ•˜์—ฌ ์š”์†Œ๋ฅผ ์•ˆ๋ณด์ด๊ฒŒ ํ•ฉ๋‹ˆ๋‹ค. ๋•Œ๋ฌธ์— ์š”์†Œ๋Š” ์‚ฌ๋ผ์ ธ๋„ ์˜์—ญ์€ ๋‚จ๊ฒŒ ๋˜๋ฉฐ ์• ๋‹ˆ๋ฉ”์ด์…˜๋„ ์ ์šฉ์ด ๊ฐ€๋Šฅํ•ฉ๋‹ˆ๋‹ค. ๐Ÿ’ก ์ฝ”๋“œ ๋ณด๊ธฐ p {opac.. 2022. 8. 26.
728x90
๋ฐ˜์‘ํ˜•

Lucky Charms Rainbow
js
html
css