Curso de HTML | Cómo hacer el efecto Parallax sólo con HTML y CSS 1

Curso de HTML
Cómo hacer el efecto Parallax sólo con HTML y CSS

Curso de HTML | Cómo hacer el efecto Parallax sólo con HTML y CSS 2

Curso de HTML | Cómo hacer el efecto Parallax sólo con HTML y CSS

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.  

Utilizando background-attachment:fixed podemos hacer que aunque las capas se desplacen, su imagen de fondo permanezca fija

Selector :not(selector)

<style>
	input:not([type=checkbox]){
		width: 570px;
		display: block;
		border-radius: 15px;
	}
</style>

<input type="text" /><br>
<input type="text" />
<br>
<input type="checkbox">
<input type="checkbox">

Ejercicio Autopista

Para hacer funcionar el ejemplo de la imagen de la cabecera, aplicaremos la a una capa a la que le daremos una altura. A dicha capa le asignaremos los estilos:

background-attachment: fixed;
background-size:cover
Descargar Recurso