Web/CSS
[CSS-Visual Studio Code] shadow 그림자
삐옥
2021. 12. 17. 10:40
Shadow 그림자
1. text-shadow: x y blur color
2. box-shadow: npx npx npx color
블럭태그, 인라인태그 그림자 효과
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
|
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
.box { border: 1px solid black; width: 200px; height: 100px; margin: 20px; }
/* 개체간의 중첩된 margin은 합이 아니라, 큰 마진이 적용된다. */
/* #box1 { margin-bottom: 10px; }
#box2 { margin-top: 20px; } */
</style>
</head>
<body>
<div id="box1" class="box">상자1</div>
<div id="box2" class="box">상자2</div>
<div id="box3" class="box">상자3</div>
<hr>
<p>안녕하세요. <span>삐옥이</span>입니다. 저는 <span>CSS 공부</span>를 합니다.</p>
</body>
</html>
|
cs |
개발자도구 (F12) : 참고용
