๐ป๊ทธ๋ฆผ์๐ป
1. text-shadow: x y blur color
2. box-shadow: x y blur color
- x, y ํ์๊ณผ์ ๊ฑฐ๋ฆฌ๋ผ๊ณ ์๊ฐํ๋ฉด๋๋ค.
- ๊ฐ์ด ํด ์๋ก ๊ทธ๋ฆผ์์์ ๊ฑฐ๋ฆฌ๊ฐ ๋ฉ์ด์ง๋ค.
<body>
<div id="box1" class="box">์์1</div>
<div id="box2" class="box">์์2</div>
<div id="box3" class="box">์์3</div>
</body> <style>
.box {margin: 20px;}
#box1 {
text-shadow: 2px 2px 2px #999;
}
#box2 {
box-shadow: 2px 2px 3px #999;
}
</style>
๊ฐ๋ฐ์ ๋๊ตฌ๋ฅผ ์ด์ด ์กฐ์ ๊ฐ๋ฅํ๋ค
'WEB > CSS' ์นดํ ๊ณ ๋ฆฌ์ ๋ค๋ฅธ ๊ธ
| font awesome (0) | 2023.09.27 |
|---|---|
| [CSS] ์์์ ํ ๋๋ฆฌ ๋ฅ๊ธ๊ธฐ : border-radius (0) | 2023.09.26 |
| [CSS] display, float ์ฌ์ฉํ์ฌ ์ฌ๋ฐฑ ์ง์ฐ๊ธฐ (0) | 2023.09.26 |
| [CSS] ์์์ ์/๋ค์ ์ถ๊ฐ ๋ด์ฉ ์์ฑ : ์ ํ์ ํ์ (0) | 2023.09.26 |
| [CSS] ํน์ ํ ์์ฑ์ ๊ฐ์ง ์์๋ค์ ์ ํ : ์์ฑ ์ ํ์ (0) | 2023.09.26 |
