1
00:00:02,290 --> 00:00:06,849
Bueno, pues yo soy Iván Zugazaga, alumno de segundo de SMRB del Instituto IES Villablanca

2
00:00:06,849 --> 00:00:08,929
y voy a empezar a explicar mi proyecto.

3
00:00:09,089 --> 00:00:14,410
Mi proyecto consta de cuatro documentos HTML, una carpeta con los estilos

4
00:00:14,410 --> 00:00:17,190
y una carpeta con las fotos que he utilizado.

5
00:00:17,769 --> 00:00:20,890
Pues voy a empezar a explicar la página de HTML principal.

6
00:00:21,550 --> 00:00:24,750
Primero lo abrimos con la extensión de Live Server

7
00:00:24,750 --> 00:00:31,129
y mi página principal tiene un header con la clase header1, ¿vale?

8
00:00:31,129 --> 00:00:51,130
Que tiene un font size 50px para hacerla más grande, textaline center para que esté centrada, color blanco, color white para que las letras estén blancas, un font height bold para que esté en negrita y resalte, un font style italic para que esté en cursiva y un text decoration underline para que esté subrayado.

9
00:00:51,130 --> 00:00:52,890
subrayado, luego

10
00:00:52,890 --> 00:00:54,710
sigue una barra de navegación

11
00:00:54,710 --> 00:00:59,009
luego lo continúa una barra de navegación

12
00:00:59,009 --> 00:01:00,969
con un background

13
00:01:00,969 --> 00:01:03,369
linear gradient para que haya un pequeño degradado

14
00:01:03,369 --> 00:01:04,290
de colores

15
00:01:04,290 --> 00:01:07,349
y un margin top 15 para que haya un espacio

16
00:01:07,349 --> 00:01:07,989
entre el header

17
00:01:07,989 --> 00:01:11,329
luego dentro de la barra de navegación

18
00:01:11,329 --> 00:01:13,269
tengo unos divs

19
00:01:13,269 --> 00:01:14,489
con la clase botón

20
00:01:14,489 --> 00:01:20,090
con la clase botón

21
00:01:20,090 --> 00:01:21,629
que tiene background color white

22
00:01:21,629 --> 00:01:27,909
Un width max content para que ocupe el máximo de contenido posible

23
00:01:27,909 --> 00:01:33,370
Un border radius 15px para que el borde esté redondeado

24
00:01:33,370 --> 00:01:36,890
Un padding de 15 para que haya una pequeña separación

25
00:01:36,890 --> 00:01:42,209
Un font size de 15px para que la letra sea un poco más grande

26
00:01:42,209 --> 00:01:47,670
Margin length de 250px para que haya espacio en cada una a la izquierda

27
00:01:47,670 --> 00:01:51,709
margin-top de 10 nuevamente para que haya un pequeño espacio aquí

28
00:01:51,709 --> 00:01:53,170
aquí arriba, perdón

29
00:01:53,170 --> 00:01:57,549
margin-bottom para que haya también un pequeño espacio aquí

30
00:01:57,549 --> 00:02:00,969
color black y text-underline none

31
00:02:00,969 --> 00:02:03,469
y también tengo una etiqueta

32
00:02:03,469 --> 00:02:06,329
que es el dos puntos hover

33
00:02:06,329 --> 00:02:10,050
para que cada vez que pase el cursor del ratón cambie de color

34
00:02:10,050 --> 00:02:12,229
luego tengo aquí un h2

35
00:02:12,229 --> 00:02:15,110
con la frase tres características que me define

36
00:02:15,110 --> 00:02:19,969
Y lo único que tiene este H2 es un font-size.

37
00:02:20,669 --> 00:02:27,550
Luego tengo aquí, ya todo esto está dentro de la etiqueta main, ¿vale?

38
00:02:27,990 --> 00:02:36,319
Con un section para ir separando básicamente las diferentes secciones del documento.

39
00:02:37,580 --> 00:02:45,439
Un section que contiene la clase características, perdón que no la escribo bien,

40
00:02:45,439 --> 00:02:48,360
Con un column count 3 para que tenga 3 columnas

41
00:02:48,360 --> 00:02:50,240
Un width para que sea más largo

42
00:02:50,240 --> 00:02:54,500
Un height para que tenga más profundidad hacia abajo

43
00:02:54,500 --> 00:02:57,060
Float left para que esté a la izquierda

44
00:02:57,060 --> 00:02:59,560
Margin top 10 para dejar un pequeño espacio

45
00:02:59,560 --> 00:03:03,879
Arriba margin bottom 20 nuevamente para dejar aquí un pequeño espacio

46
00:03:03,879 --> 00:03:07,960
Un background color blanched almond para que esté de este color

47
00:03:07,960 --> 00:03:11,240
Padding 5

48
00:03:11,240 --> 00:03:14,460
Border 3px sólido y azul

49
00:03:14,460 --> 00:03:17,879
TextAlincente para que todo esté centrado

50
00:03:17,879 --> 00:03:20,979
Color para que las letras estén en negras

51
00:03:20,979 --> 00:03:26,340
Y un font-size de 20px para que las letras sean un poco más grandes

52
00:03:26,340 --> 00:03:30,439
Y luego en cada columna tengo una característica

53
00:03:30,439 --> 00:03:33,840
Abro una etiqueta artículo y voy poniendo las características

54
00:03:33,840 --> 00:03:38,900
Con un h3 y un párrafo que el h3 tiene en el CSS

55
00:03:38,900 --> 00:03:43,280
Las características de font-height-bold para que esté en negrita

56
00:03:43,280 --> 00:03:45,560
y text underline para que esté subrayado

57
00:03:45,560 --> 00:03:46,919
vale

58
00:03:46,919 --> 00:03:49,699
luego siguiendo

59
00:03:49,699 --> 00:03:51,759
tendría otro section

60
00:03:51,759 --> 00:03:52,599
donde habría

61
00:03:52,599 --> 00:03:55,719
otro h2 que serían dos cosas que nunca dejaría

62
00:03:55,719 --> 00:03:56,120
de hacer

63
00:03:56,120 --> 00:03:59,900
nuevamente tiene las mismas características

64
00:03:59,900 --> 00:04:00,719
que este h2

65
00:04:00,719 --> 00:04:03,479
pondría un hr que el único que le he puesto

66
00:04:03,479 --> 00:04:05,800
ha sido color kaki para que le cambie

67
00:04:05,800 --> 00:04:06,500
el color

68
00:04:06,500 --> 00:04:09,659
y un border 2px

69
00:04:09,659 --> 00:04:11,000
solid para que sea sólido

70
00:04:11,000 --> 00:04:13,159
y se pueda ver mejor

71
00:04:13,159 --> 00:04:18,019
luego tendría un artículo con un h3 clase artículo 2

72
00:04:18,019 --> 00:04:22,240
artículo 2

73
00:04:22,240 --> 00:04:31,529
con un margin rate de 300px para dejar una separación a la izquierda

74
00:04:31,529 --> 00:04:33,589
vale, tendría

75
00:04:33,589 --> 00:04:36,649
voy a cerrar la carpeta de las fotos que si no me lío

76
00:04:36,649 --> 00:04:38,189
tendría un href

77
00:04:38,189 --> 00:04:42,350
vale, que cuando tú pinchas en la foto te abrirá una pestaña nueva

78
00:04:42,350 --> 00:04:44,310
al gimnasio básicamente

79
00:04:44,310 --> 00:04:47,209
y las dos cosas que no dejaré de hacer

80
00:04:47,209 --> 00:04:48,730
que se me ha olvidado decirlas

81
00:04:48,730 --> 00:04:50,829
mis disculpas son ir al gimnasio

82
00:04:50,829 --> 00:04:51,769
y ver la UFC

83
00:04:51,769 --> 00:04:53,970
y luego tendría una clase

84
00:04:53,970 --> 00:04:55,689
una foto, perdón

85
00:04:55,689 --> 00:04:58,870
que es la del gimnasio con un título gimnasio

86
00:04:58,870 --> 00:05:00,470
luego

87
00:05:00,470 --> 00:05:02,670
al cerrar el artículo abriría otra

88
00:05:02,670 --> 00:05:04,370
con un h3 que sea ver la UFC

89
00:05:04,370 --> 00:05:07,009
nuevamente tiene un enlace que si pinchas

90
00:05:07,009 --> 00:05:08,930
te lleva a la página principal

91
00:05:08,930 --> 00:05:10,709
luego la imagen

92
00:05:10,709 --> 00:05:12,810
nuevamente de la UFC con su propio

93
00:05:12,810 --> 00:05:14,009
título de UFC

94
00:05:14,009 --> 00:05:17,889
¿Vale? Luego cerraría el artículo y el section

95
00:05:17,889 --> 00:05:19,649
Pondría otro h2

96
00:05:19,649 --> 00:05:21,810
Que tiene font-height-volt

97
00:05:21,810 --> 00:05:26,209
Y font-size 25px para hacerlo más grande

98
00:05:26,209 --> 00:05:28,910
Pondría nuevamente un hr

99
00:05:28,910 --> 00:05:31,649
¿Vale? Para separarlo

100
00:05:31,649 --> 00:05:36,069
Y abriría otro section con un artículo que tiene de clase artículo 4

101
00:05:36,069 --> 00:05:39,209
Que te pondría un margin-right de 300px

102
00:05:39,209 --> 00:05:42,889
Para dejar bastante margen a la derecha

103
00:05:42,889 --> 00:05:45,730
Y lo que contiene es una S3

104
00:05:45,730 --> 00:05:50,009
Que es la aplicación que más utilizo con frecuencia

105
00:05:50,009 --> 00:05:53,810
Y debajo una foto con un href nuevamente

106
00:05:53,810 --> 00:05:55,350
Que si pinchas te llevaría a Instagram

107
00:05:55,350 --> 00:05:59,509
Y una imagen, que es la imagen de Instagram

108
00:05:59,509 --> 00:06:01,850
Que si tú mantienes el cursor

109
00:06:01,850 --> 00:06:03,730
Saldría Instagram como título

110
00:06:03,730 --> 00:06:06,129
Cierro el main y debajo tengo el footer

111
00:06:06,129 --> 00:06:09,949
¿Vale? Con clase footer index

112
00:06:09,949 --> 00:06:15,759
que tiene font-height-bolt para hacer la letra en negrita,

113
00:06:16,379 --> 00:06:20,259
un background-linear-gradient para tener el mismo degradado que en el NAP,

114
00:06:21,240 --> 00:06:23,199
clear-both para que esté abajo,

115
00:06:24,259 --> 00:06:26,439
un text-alien-center para que esté todo en el centro

116
00:06:26,439 --> 00:06:29,939
y un padding para que haya una pequeña separación.

117
00:06:31,339 --> 00:06:35,079
Vale, pues tendría aquí este texto que la página web que era dada por mí,

118
00:06:35,399 --> 00:06:38,319
luego un br para ponerlo debajo

119
00:06:38,319 --> 00:06:44,639
y nuevamente un enlace que si pinchas aquí te lleva al github para descargarte la aplicación

120
00:06:44,639 --> 00:06:53,459
y luego tendría una site a la izquierda, vale, con la información sobre mí

121
00:06:53,459 --> 00:07:00,600
pero te voy a decir lo que tiene los sites, que tiene background color khaki para que esté de este color

122
00:07:00,600 --> 00:07:06,680
un color black para que las letras estén en negro, float left para que esté a la izquierda

123
00:07:06,680 --> 00:07:28,009
Un Width para que sea más largo, un Height de 800px para que tenga más profundidad hacia abajo, un Margin Top para que haya una pequeña separación aquí, Textaline Center para que las letras estén a la izquierda y un Border sólido negro para que se pueda remarcar.

124
00:07:28,009 --> 00:07:35,449
Esta site contiene información sobre mí y este contiene datos y esta site tiene básicamente las mismas características que este en el CSS.

125
00:07:36,089 --> 00:07:48,329
Pasamos al currículum donde tiene nuevamente el header, la barra de navegación con un degradado de colores y tiene la clase nap currículum, ¿vale?

126
00:07:48,329 --> 00:08:02,329
y un margin top para que haya una pequeña separación, un dos puntos hover para que los deep al pasar el ratón se pongan en gris

127
00:08:02,329 --> 00:08:13,509
y luego dos asides nuevamente iguales que los de la página principal con exactamente las mismas características, lo único cambiando el color.

128
00:08:13,509 --> 00:08:19,399
Vale, voy a empezar ya a explicar la página del currículum

129
00:08:19,399 --> 00:08:23,819
Tendríamos para empezar un main para que todo sea principal

130
00:08:23,819 --> 00:08:33,679
Un div con clase encabezado que tiene background color este color

131
00:08:33,679 --> 00:08:35,480
Para que sea azul

132
00:08:35,480 --> 00:08:40,019
Un height de 230px para que esto sea más profundo

133
00:08:40,019 --> 00:08:43,519
Y un color white para que todo lo que esté dentro esté en blanco

134
00:08:43,519 --> 00:08:47,720
Una imagen con la clase imagen

135
00:08:47,720 --> 00:08:51,139
Que es básicamente mi foto

136
00:08:51,139 --> 00:08:56,990
Que tiene un margin top de 50 para que haya un espacio

137
00:08:56,990 --> 00:09:00,190
Tiene un width de 110 para que sea más grande

138
00:09:00,190 --> 00:09:02,789
Tiene un border sólido negro para que se resalte

139
00:09:02,789 --> 00:09:04,990
Y un margin left para que haya un espacio a la izquierda

140
00:09:04,990 --> 00:09:07,429
Siguiendo con el currículum

141
00:09:07,429 --> 00:09:12,950
Habría un section con un h2 y un h4

142
00:09:12,950 --> 00:09:17,590
que tiene float right para que esté a la derecha

143
00:09:17,590 --> 00:09:20,590
margin left 120

144
00:09:20,590 --> 00:09:22,429
padding right 50

145
00:09:22,429 --> 00:09:25,570
y margin top 60 para que haya sus respectivos espacios

146
00:09:25,570 --> 00:09:32,500
luego seguiría una lista ordenada

147
00:09:32,500 --> 00:09:34,019
con la clase información

148
00:09:34,019 --> 00:09:40,269
float right para que esté por aquí

149
00:09:40,269 --> 00:09:43,830
y un margin top para que haya un espacio

150
00:09:43,830 --> 00:09:46,090
y siguiendo

151
00:09:46,090 --> 00:09:55,710
tiene el único cambio que he hecho ha sido poner list style imagen url para que sustituir el punto por esta foto

152
00:09:55,710 --> 00:10:03,070
y un textaline left para que salga a la izquierda y con esto es exactamente lo mismo

153
00:10:03,070 --> 00:10:10,389
cerraríamos la barra de navegación el div perdón abriríamos otro con un section que sea class sobre mi

154
00:10:10,389 --> 00:10:15,710
que tiene un margin button de 15px y un textaline left para poner esto todo a la izquierda

155
00:10:16,090 --> 00:10:17,389
vale

156
00:10:17,389 --> 00:10:20,350
tendría un

157
00:10:20,350 --> 00:10:21,970
h2 con clase yo

158
00:10:21,970 --> 00:10:23,230
vale

159
00:10:23,230 --> 00:10:26,350
lo único que tiene es un float left para que

160
00:10:26,350 --> 00:10:28,029
esté a la izquierda, padded left para que haya

161
00:10:28,029 --> 00:10:30,809
un espacio a la izquierda

162
00:10:30,809 --> 00:10:32,789
text decorator para que esté subrayado

163
00:10:32,789 --> 00:10:35,230
font style para que esté en cursiva

164
00:10:35,230 --> 00:10:36,970
margin top para que haya espacio

165
00:10:36,970 --> 00:10:38,250
arriba y un margin bottom

166
00:10:38,250 --> 00:10:40,730
para que haya espacio abajo

167
00:10:40,730 --> 00:10:41,710
vale

168
00:10:41,710 --> 00:10:45,070
y luego tendría un h3

169
00:10:45,070 --> 00:10:50,330
Un H3 que pone estudiantes en empresa de celebrar con ganas de conseguir trabajo

170
00:10:50,330 --> 00:10:53,009
Que tiene un color white para que esté en blanco

171
00:10:53,009 --> 00:10:55,850
Y un font size para que esté más grande

172
00:10:55,850 --> 00:11:00,490
Luego seguiríamos con educación y preparación

173
00:11:00,490 --> 00:11:03,070
Que es otro H2 con esta clase

174
00:11:03,070 --> 00:11:08,169
Que tiene los mismos rasgos que esta para que estén alineadas

175
00:11:08,169 --> 00:11:12,350
Luego dentro lo seguiría una tabla

176
00:11:12,350 --> 00:11:18,539
que tiene un TH del tiempo que estuve cursando la ESO

177
00:11:18,539 --> 00:11:20,879
y un TD de donde cursé la ESO

178
00:11:20,879 --> 00:11:26,179
y también un TH del tiempo que estoy cursando este grado

179
00:11:26,179 --> 00:11:28,240
y un TD en donde lo estoy haciendo

180
00:11:28,240 --> 00:11:31,820
por ejemplo la ESO empecé el 1 de septiembre del 2018

181
00:11:31,820 --> 00:11:35,600
y acabé el 20 de junio del 2022 en el GS de Moratalab

182
00:11:35,600 --> 00:11:38,659
y SMR empecé el 1 de septiembre del 2022

183
00:11:38,659 --> 00:11:41,720
y sigo cursando este curso en el IES Villablanca

184
00:11:41,720 --> 00:11:49,320
luego tendría otro section con un class que tendría proyectos

185
00:11:49,320 --> 00:11:53,659
que tiene float left para que esté a la izquierda

186
00:11:53,659 --> 00:11:57,080
margin de 25px para que haya un margen

187
00:11:57,080 --> 00:12:01,779
text decorator underline, font style y un color white

188
00:12:01,779 --> 00:12:12,350
y luego detrás de eso lo seguiría otra nueva tabla con un th

189
00:12:12,350 --> 00:12:15,169
que es el tiempo que estuve haciendo el proyecto de WordPress

190
00:12:15,169 --> 00:12:17,789
y un td que es el nombre del proyecto

191
00:12:17,789 --> 00:12:20,070
y luego también debajo otro th

192
00:12:20,070 --> 00:12:23,350
del tiempo que estuve haciendo un proyecto académico con Moodle

193
00:12:23,350 --> 00:12:24,309
y el nombre del proyecto

194
00:12:24,309 --> 00:12:28,350
y luego para acabar cerraría el div y cerraría el main

195
00:12:28,350 --> 00:12:32,090
y habría un footer con clase footer currículum

196
00:12:32,090 --> 00:12:36,470
que es exactamente igual que el footer de la página principal

197
00:12:36,470 --> 00:12:39,490
solo que lo único que cambia es que este

198
00:12:39,490 --> 00:12:42,570
tiene el background linear gradient en azul

199
00:12:42,570 --> 00:12:44,289
para que pegue con la página web

200
00:12:44,289 --> 00:12:46,929
y nuevamente aquí el enlace para descargarlo

201
00:12:46,929 --> 00:12:49,470
siguiendo con el formulario

202
00:12:49,470 --> 00:12:52,049
el formulario tendría

203
00:12:52,049 --> 00:12:55,429
vendríamos por aquí arriba

204
00:12:55,429 --> 00:12:59,590
y tendría este script

205
00:12:59,590 --> 00:13:01,110
que lo explicaré más adelante

206
00:13:01,110 --> 00:13:03,470
el header1 nuevamente

207
00:13:03,470 --> 00:13:05,149
la barra de navegación

208
00:13:05,149 --> 00:13:10,389
la barra de navegación con clase navformulario

209
00:13:10,389 --> 00:13:15,830
que tiene background linear gradient

210
00:13:15,830 --> 00:13:17,350
para hacer este degradado

211
00:13:17,350 --> 00:13:20,309
nuevamente los deep con un hover

212
00:13:20,309 --> 00:13:22,129
para que cada vez que pases el ratón

213
00:13:22,129 --> 00:13:23,809
se vea en dorado

214
00:13:23,809 --> 00:13:26,230
los asides nuevamente

215
00:13:26,230 --> 00:13:28,470
que lo único que cambia

216
00:13:28,470 --> 00:13:31,950
sería el color rojo

217
00:13:31,950 --> 00:13:34,509
y el borde rojo

218
00:13:34,509 --> 00:13:36,789
y esto que es un color white

219
00:13:36,789 --> 00:13:39,590
para poner todas las letras en blanco

220
00:13:39,590 --> 00:13:45,970
y empezando con el currículum, o sea, perdón, empezando con el formulario

221
00:13:45,970 --> 00:13:51,029
tendríamos un main, que es donde está todo, un h2

222
00:13:51,029 --> 00:13:56,730
con un font-size y un color para hacer la letra más grande y que esté en blanca

223
00:13:56,730 --> 00:14:01,669
y empezaría con un form, la etiqueta form que es la del formulario

224
00:14:01,669 --> 00:14:04,830
y empezaríamos con la etiqueta fieldset

225
00:14:04,830 --> 00:14:09,029
que le tengo puesto un background color rojo

226
00:14:09,029 --> 00:14:10,830
las letras en negro

227
00:14:10,830 --> 00:14:12,889
un text online left para ponerla

228
00:14:12,889 --> 00:14:14,590
a la derecha, bordes radius para que

229
00:14:14,590 --> 00:14:16,570
este borde así

230
00:14:16,570 --> 00:14:17,710
curvo

231
00:14:17,710 --> 00:14:20,450
un width para que sea más largo

232
00:14:20,450 --> 00:14:22,350
un height para que sea más

233
00:14:22,350 --> 00:14:24,190
para que tenga más

234
00:14:24,190 --> 00:14:26,950
no me sale la palabra

235
00:14:26,950 --> 00:14:27,889
perdón, para que

236
00:14:27,889 --> 00:14:30,950
tenga más profundidad hacia abajo

237
00:14:30,950 --> 00:14:33,889
y ya está básicamente

238
00:14:33,889 --> 00:14:43,090
y luego dentro de ese fieldset vendría un input de tipo texto con un nombre concreto y con un placeholder

239
00:14:43,090 --> 00:14:47,710
y tendría su label concreto con el título nombre de usuario.

240
00:14:48,669 --> 00:14:54,789
Seguiría otro label, un label de tipo correo con su nombre y su placeholder,

241
00:14:56,009 --> 00:15:00,710
perdón, un input de tipo correo con su label correspondiente y con su título de correo electrónico.

242
00:15:00,710 --> 00:15:05,309
Luego vendría el label un input de tipo password

243
00:15:05,309 --> 00:15:09,830
Con su nombre, su label concreto y con el título contraseña

244
00:15:09,830 --> 00:15:13,750
Nuevamente un nuevo label de tipo contraseña

245
00:15:13,750 --> 00:15:16,409
Y aquí cerraría el fieldset

246
00:15:16,409 --> 00:15:20,730
Abriría otro con un legend que tiene un h2

247
00:15:20,730 --> 00:15:29,029
Y dentro está un input de tipo texto

248
00:15:29,029 --> 00:15:55,450
con su nombre, su placeholder y el título de nombre, luego otro input type de tipo texto con su nombre, su placeholder y su label con el nombre de apellidos, luego vendría un input type de tipo fecha, de tipo date con su fecha de nacimiento y su label y su título fecha de nacimiento, luego vendría un input de tipo radio que es para seleccionar

249
00:15:55,450 --> 00:16:00,389
con su label básicamente con el nombre sexo.

250
00:16:00,789 --> 00:16:03,929
Luego vendría un input type de tipo number para poner la altura

251
00:16:03,929 --> 00:16:08,629
con su placeholder y su label correspondiente con el nombre altura.

252
00:16:09,309 --> 00:16:13,730
Luego vendría un input de tipo tel para poner el número de teléfono

253
00:16:13,730 --> 00:16:17,610
con su placeholder y su label número de teléfono.

254
00:16:18,250 --> 00:16:25,070
Luego vendría un input type de tipo option, un input de tipo select, perdón,

255
00:16:25,450 --> 00:16:29,549
con sus diferentes opciones para poder seleccionar la que tú quieras.

256
00:16:29,710 --> 00:16:31,350
Y nuevamente con su nuevo label.

257
00:16:32,789 --> 00:16:38,029
Siguiéndolo y último input, vendría un input type de tipo color,

258
00:16:39,230 --> 00:16:42,230
con su label de color preferido para seleccionar el color.

259
00:16:43,809 --> 00:16:47,889
Cerraría nuevamente el field set y abriría otro,

260
00:16:47,889 --> 00:16:52,710
con uno que sea de datos académicos,

261
00:16:52,710 --> 00:17:04,710
que tenga un label de tipo select nuevamente para seleccionar el tipo, un input de tipo select para seleccionar nuevamente el título que tengas

262
00:17:04,710 --> 00:17:15,529
y un label con el nombre de títulos obtenidos. Lo seguiría un label de tipo checkbox, ¿vale? Para seleccionar el idioma.

263
00:17:15,529 --> 00:17:21,109
Lo que diferencia este checkbox de este radio es que tú puedes seleccionar más de uno, ¿vale?

264
00:17:21,789 --> 00:17:27,089
En el tipo radio solamente puedes seleccionar uno, pero en el checkbox puedes seleccionar más de uno.

265
00:17:27,769 --> 00:17:36,589
Luego le seguiría un input type de tipo rango, con su label en específico, para poder seleccionar el rango que quieras.

266
00:17:36,589 --> 00:17:47,549
Y luego vendría un input type de tipo textarea, que es esta cajita de aquí, con su placeholder y su label.

267
00:17:48,109 --> 00:17:54,369
Y vamos a rellenar este formulario para ver que funciona.

268
00:17:55,609 --> 00:18:02,329
Vamos poniendo por aquí, lo bueno de esta contraseña sale aquí en privado, de modo que nadie lo pueda ver.

269
00:18:02,329 --> 00:18:05,440
y van

270
00:18:05,440 --> 00:18:08,019
vamos a ir seleccionando

271
00:18:08,019 --> 00:18:09,759
las cosas

272
00:18:09,759 --> 00:18:11,920
para ver que funciona

273
00:18:11,920 --> 00:18:16,049
vale, altura podemos poner

274
00:18:16,049 --> 00:18:17,930
unos 67, número de teléfono

275
00:18:17,930 --> 00:18:20,210
659, 38, 76

276
00:18:20,210 --> 00:18:22,410
55, estado civil, soltero

277
00:18:22,410 --> 00:18:24,410
color preferido, verde

278
00:18:24,410 --> 00:18:26,150
vale, luego datos

279
00:18:26,150 --> 00:18:27,650
académicos, yo por ejemplo

280
00:18:27,650 --> 00:18:30,329
voy a seleccionar que tengo

281
00:18:30,329 --> 00:18:31,009
la ESO

282
00:18:31,009 --> 00:18:34,289
domino el inglés, el francés

283
00:18:34,289 --> 00:18:47,299
otro idioma y voy a poner el español. Nivel de inglés tengo un B2 y cualidades, no suelo

284
00:18:47,299 --> 00:18:57,970
tener cualidades, pues lo pongo por aquí. Le doy a enviar y pone tu formulario se ha

285
00:18:57,970 --> 00:19:04,589
enviado correctamente. Luego aquí también lo podemos cambiar, que podemos poner esto

286
00:19:04,589 --> 00:19:06,130
Y vamos a ver que funciona

287
00:19:06,130 --> 00:19:08,589
Formulario

288
00:19:08,589 --> 00:19:10,829
Enviado

289
00:19:10,829 --> 00:19:11,769
Así por ejemplo, vale

290
00:19:11,769 --> 00:19:14,230
Y podemos enviarlo

291
00:19:14,230 --> 00:19:16,490
Y aquí cambia el formulario enviado

292
00:19:16,490 --> 00:19:19,150
Y ya para terminar el formulario

293
00:19:19,150 --> 00:19:20,630
Tendríamos

294
00:19:20,630 --> 00:19:22,990
Cerraríamos el main, tendríamos un footer

295
00:19:22,990 --> 00:19:24,970
Nuevamente

296
00:19:24,970 --> 00:19:26,789
Como todas las páginas

297
00:19:26,789 --> 00:19:28,789
Con su clase de

298
00:19:28,789 --> 00:19:30,150
Footer formulario

299
00:19:30,150 --> 00:19:32,490
Lo único que cambia es el background

300
00:19:32,490 --> 00:19:34,670
Linear gradient para que esté también

301
00:19:34,670 --> 00:19:37,630
Con ese degradado

302
00:19:37,630 --> 00:19:38,650
Y ya por último

303
00:19:38,650 --> 00:19:40,549
La última parte

304
00:19:40,549 --> 00:19:41,970
La del proyecto

305
00:19:41,970 --> 00:20:32,980
La de este main

306
00:20:32,980 --> 00:20:41,519
Puede ir

307
00:20:41,519 --> 00:22:07,750
Y tienen aquí

308
00:22:07,750 --> 00:22:12,250
Otras posibilidades

309
00:22:12,250 --> 00:22:12,670
De proyecto