- index.html
- style.css
HTML
<!DOCTYPE html>
<html lang="es">
<head>
<title>Construir un fondo complejo: parte 2</title>
<meta charset="utf-8">
<link rel="stylesheet" href="style.css">
</head>
<body>
<div class="pattern"></div>
</body>
</html>
CSS
.pattern {
margin: 100px auto;
width: 100px;
height: 100px;
background-color: #333333;
background-image:
linear-gradient(135deg, white 25%, transparent 25%),
linear-gradient(225deg, white 25%, transparent 25%),
none,
none;
box-shadow: 1px 1px 3px #333333;
}
html,
body {
margin: 0;
padding: 0;
}
Ha ido a otra página
ObjetivosRealizado
0
Añade al bloque .pattern otros dos degradados de white a transparent con una transición brusca en el 25%:
- El tercer degradado debe tener un ángulo de
45°, - y el cuarto, un ángulo de
315°.