-
Notifications
You must be signed in to change notification settings - Fork 0
/
sombras.html
63 lines (57 loc) · 1.67 KB
/
sombras.html
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
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
<!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>Curso de CSS AVANZADO 🔥 efecto SOMBRA - yacklyon</title>
<style>
p {
/* font-size: 75px; */
/* color: white; */
/* el primer valor es de izquierda o derecha */
/* el segundo valor es de arriba o abajo */
/* el tercer es la dimension de la sombra */
/* text-shadow: 1px 1px 25px black, 0 0 22px red; */
/* font-weight: bold;
text-align: center;
text-transform: uppercase;
letter-spacing: 2px;
margin-top: 3px;
color: yellow;
text-shadow: black 3px 3px 1px; */
/* background-color: coral;
width: 400px;
height: 150px;
font-size: 70px; */
/* box-shadow: 10px 20px 20px red; */
/* box-shadow: black 0px 3px 10px; */
}
.tarjeta {
width: 250px;
text-align: center;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2), 0 6px 20px;
}
.numero {
background-color: darkred;
color: white;
padding: 10px;
font-size: 50px;
}
.titulo {
padding: 5px;
}
</style>
</head>
<body>
<h1>sombras en css</h1>
<div class="tarjeta">
<div class="numero">
<h1>10</h1>
</div>
<div class="titulo">
<p>css</p>
</div>
</div>
</body>
</html>