1
00:00:00,630 --> 00:00:04,680
Continuamos este proyecto y hemos creado este sección.

2
00:00:04,680 --> 00:00:12,460
De momento vamos a hacerlo un poco más general y vamos a volver a crear los globales y tenemos este

3
00:00:12,460 --> 00:00:19,930
H2 aquí tenemos el H2 así que vamos a dar estilos a esta parte y vamos a crear esta sección pero no

4
00:00:19,930 --> 00:00:27,850
vamos a crear sección aquí sección y como dije vamos a probar así como un par de i30 pixeles cero esto

5
00:00:27,850 --> 00:00:30,960
para tener esta separación.

6
00:00:31,120 --> 00:00:37,150
Si en futuras secciones o dips etcétera tendremos lo mismo en nuestro diseño que si lo tenemos acá abajo

7
00:00:37,150 --> 00:00:44,710
si está igual acá abajo también y acá abajo también nos va vamos a tener que agregar nada más esa clase

8
00:00:44,710 --> 00:00:47,090
y se va a ir viendo mejor.

9
00:00:47,110 --> 00:00:49,530
Recargamos y veamos que nos agrega este padrino.

10
00:00:50,870 --> 00:00:59,780
Tenemos el H2 y este se utiliza la fuente de Oswalt pero también vamos a poner aquí un Francis 2.4 en

11
00:01:00,210 --> 00:01:04,220
recargamos y vemos que es un poco más grande.

12
00:01:04,220 --> 00:01:09,190
Ocupamos un text transfuga o Perquis para hacerlo todo en mayúsculas.

13
00:01:09,200 --> 00:01:11,210
Se vea como el de nuestro diseño

14
00:01:14,230 --> 00:01:19,320
y por último la vas a poner un texto Hola.En Center

15
00:01:22,330 --> 00:01:23,270
se vea bien.

16
00:01:23,290 --> 00:01:30,370
De esta forma puedes ver que si vemos nuestro diseño tenemos este pequeño diseño aquí con tres engranes

17
00:01:30,820 --> 00:01:33,920
eso los vas a encontrar unas imágenes que hemos copiado.

18
00:01:34,090 --> 00:01:42,120
Hay uno que se llama separador punto PNG y vamos encontrar y esto los vamos a utilizar con un HD2 after

19
00:01:43,720 --> 00:01:46,640
y vamos a ponerle contén siempre que utilices Adapter o Gifford.

20
00:01:46,640 --> 00:01:48,260
Tienes que ponerle un content.

21
00:01:48,290 --> 00:01:51,920
Eso es como una ley si no va a ser un after vacío.

22
00:01:53,780 --> 00:02:00,760
Margin cero auto porque tenemos el texto descentradas y que por lo tanto nuestro after también debe

23
00:02:00,760 --> 00:02:11,320
de estar centrado background image así que le puedes poner al after una imagen o una imagen o un texto

24
00:02:11,840 --> 00:02:14,820
o lo que quieras R.L.

25
00:02:15,070 --> 00:02:20,910
Punto punto de Donal y MG separador punto PNG.

26
00:02:22,250 --> 00:02:26,920
Le agregamos un alto de 30 píxeles y un ancho de 100 píxeles.

27
00:02:27,720 --> 00:02:37,100
Y por último le ponemos un display Block para que tome las propiedades bien BB+ que aparece el H2 afters

28
00:02:37,410 --> 00:02:40,180
inspeccionar nada más para que quede un poco más claro.

29
00:02:40,520 --> 00:02:47,920
Damos clic aquí y vemos que más o menos se acomoda el after ahí vemos que tiene el margen cero auto

30
00:02:47,930 --> 00:02:53,180
por eso se centra en el background image tiene un alto y un ancho que es lo que le definimos.

31
00:02:53,180 --> 00:02:55,490
La parte naranja es el Marien que queda vacío.

32
00:02:57,260 --> 00:03:06,090
Y para eso también se le puso el display Blok que creo que también display no funcionaría si creamos

33
00:03:06,090 --> 00:03:11,090
el after sección ya nada más nos falta aquí sección.

34
00:03:12,590 --> 00:03:23,110
Y quiero que todos estos párrafos que estén dentro de una sección tengan una altura de 1.4 M sea un

35
00:03:23,110 --> 00:03:36,420
texto grande pero no tan grande que quede un poco más Tarbes 1.2 lo que se ve bien y un texanas Center

36
00:03:38,250 --> 00:03:40,500
para que sea línea al centro del contenido

37
00:03:43,270 --> 00:03:49,790
es color negro y no hay ningún problema y con esto ya tenemos por ejemplo el contenedor y el section

38
00:03:49,850 --> 00:03:57,190
volvemos a hacerlo un poco más pequeño y podemos ver cómo el contenido fluye gracias a nuestros contenedores

39
00:03:57,190 --> 00:04:05,640
que hemos creado dependiendo el ancho es la cantidad que va a ir tomando así que sí al principio cuando

40
00:04:05,640 --> 00:04:10,500
inicias casi cualquier proyecto se siente así como que escribes mucho CSS.

41
00:04:10,650 --> 00:04:17,280
Sin embargo conforme vas avanzando vas a ir reutilizando lo que has escrito y al final siempre lo que

42
00:04:17,280 --> 00:04:20,210
está sin hacerse será un poco más difícil.

43
00:04:20,490 --> 00:04:26,460
Pero una vez que ya tengamos así como esta estructura ya tengamos algo hecho será siempre más fácil

44
00:04:27,120 --> 00:04:34,850
o será cada vez menos lo que tengamos que escribir de CSS si vemos nuestro diseño en el siguiente capítulo

45
00:04:35,480 --> 00:04:45,690
tenemos que trabajar con esta sección de del programa del evento tendrá un vídeo de HTML 5 de fondo.

46
00:04:45,690 --> 00:04:53,100
Tendrá este programa el evento es un diseño un poco más avanzado pero vamos a ver cómo hacerlo en el

47
00:04:53,100 --> 00:04:54,190
siguiente vídeo.