1
00:00:00,560 --> 00:00:06,320
Bueno, pues ahora lo que vamos a hacer va a ser una explicación sobre selectores avanzados, ¿vale?

2
00:00:06,320 --> 00:00:14,259
Ya vimos en el vídeo anterior lo que eran los selectores y ahora vamos a ver concretamente un tipo de selector más avanzado, más especializado y también más concreto, ¿vale?

3
00:00:15,099 --> 00:00:20,440
Para ello, pues como siempre, nos vamos a ir a Brackets, que yo lo tengo aquí abierto, ¿vale?

4
00:00:20,500 --> 00:00:26,260
Ya me he creado un archivo que lo he llamado selectoresavanzados.html, ¿vale?

5
00:00:27,260 --> 00:00:30,480
Y, bueno, me he creado la estructura como siempre, ¿vale?

6
00:00:30,559 --> 00:00:40,759
HTML 2.5, tabulador y luego le cambiamos aquí el idioma y aquí le ponemos selector avanzado en hojas de estilo, en CSS3 o lo que queráis, ¿vale?

7
00:00:41,780 --> 00:00:45,479
Bueno, en primer lugar nos vamos a crear una estructura sencillita de páginas, ¿vale?

8
00:00:45,579 --> 00:00:53,929
Vamos a crearnos una cabecera H1 y vamos a poner que esto es un encabezado H1, ¿vale?

9
00:00:54,149 --> 00:00:58,229
Nos vamos a crear un párrafo, ¿vale?

10
00:00:58,350 --> 00:01:02,189
Y también nos vamos a crear justo debajo del párrafo un enlace, ¿vale?

11
00:01:02,189 --> 00:01:05,549
como dirección de href

12
00:01:05,549 --> 00:01:07,069
vamos a poner la almohadilla

13
00:01:07,069 --> 00:01:09,030
que recuerdo que esto no era en ningún sitio

14
00:01:09,030 --> 00:01:11,230
simplemente lo ponemos para que el enlace

15
00:01:11,230 --> 00:01:12,730
esté operativo, no dé error

16
00:01:12,730 --> 00:01:15,170
pero ahora mismo no nos va a enlazar en ninguna página

17
00:01:15,170 --> 00:01:16,430
simplemente para que, ¿vale?

18
00:01:16,689 --> 00:01:19,250
y el texto que va a ser

19
00:01:19,250 --> 00:01:20,989
el enlace en sí, vamos a poner

20
00:01:20,989 --> 00:01:22,390
leer más, ¿vale?

21
00:01:23,370 --> 00:01:25,349
entonces aquí estáis viendo en la parte derecha

22
00:01:25,349 --> 00:01:27,069
como se está viendo la página, ¿vale?

23
00:01:28,030 --> 00:01:29,209
y como primer

24
00:01:29,209 --> 00:01:31,150
bueno, vamos a empezar ya

25
00:01:31,150 --> 00:01:34,670
meter estilo y vamos a ver estos selectores avanzados de los que yo estaba hablando antes, ¿vale?

26
00:01:35,150 --> 00:01:38,950
En primer lugar, recuerdo que lo que tenemos que poner es la etiqueta style, ¿vale?

27
00:01:40,170 --> 00:01:43,269
Tal y como veis en pantalla, ¿vale? Voy a intentar

28
00:01:43,269 --> 00:01:46,349
aumentar un poco más la letra para que así lo podáis ver mejor.

29
00:01:47,189 --> 00:01:51,189
Esto era en... aumentar tamaño

30
00:01:51,189 --> 00:01:55,189
de frente, eso. ¿Ok? Entonces

31
00:01:55,189 --> 00:01:59,390
dentro de aquí de style, pues lo que vamos a poner, vamos a utilizar

32
00:01:59,390 --> 00:02:03,829
el primer selector avanzado, ¿vale? Entonces, el primer selector avanzado, lo voy a poner

33
00:02:03,829 --> 00:02:10,169
aquí entre comentarios, va a ser el selector universal, ¿vale? Que afecta a todos los

34
00:02:10,169 --> 00:02:16,729
elementos. Le pongo en mayúscula, ¿vale? Ese selector universal se pone poniendo el

35
00:02:16,729 --> 00:02:21,569
asterisco, ¿vale? Pondríamos asterisco, abre llave, cierra llave, y por ejemplo, si yo

36
00:02:21,569 --> 00:02:29,069
aquí pongo color y pongo green, ¿vale? Fijaros que al poner yo green, ya automáticamente

37
00:02:29,069 --> 00:02:33,990
se me ha cambiado el color de todo, del encabezado, del párrafo, del enlace, de todo, ¿vale?

38
00:02:36,159 --> 00:02:40,800
¿Qué pasa? Que esto realmente no se utiliza mucho, a no ser que nosotros queramos modificar

39
00:02:40,800 --> 00:02:47,400
determinados parámetros que nos interesen de una web, ¿vale? Pero no se utilizarán demasiado.

40
00:02:49,919 --> 00:02:55,780
Vamos a poner aquí, en su lugar, en vez de poner el color, vamos a cambiar el margen de la web, ¿vale?

41
00:02:56,500 --> 00:03:00,319
Utilizando la propiedad margin y vamos a poner 0, ¿vale?

42
00:03:00,479 --> 00:03:03,300
Fijaros cómo en cuanto lo pongo se va todo para arriba, ¿vale?

43
00:03:03,740 --> 00:03:07,819
Y otro que es el padding, que es el espaciado, que lo vamos a poner también a 0, ¿vale?

44
00:03:08,080 --> 00:03:09,379
No hace falta poner un tipo más.

45
00:03:10,960 --> 00:03:11,360
Ok.

46
00:03:13,000 --> 00:03:15,960
Vale, ahora vamos a ver, esto sería el selector universal.

47
00:03:15,960 --> 00:03:20,979
Ahora vamos a ver otro tipo de selector que es el selector múltiple, pero para ello voy a meter más contenido, ¿vale?

48
00:03:21,360 --> 00:03:23,300
Voy a añadir aquí una etiqueta h2.

49
00:03:23,300 --> 00:03:26,939
Esto es un encabezado H2

50
00:03:26,939 --> 00:03:30,419
Y vamos a añadir también un párrafo, ¿vale?

51
00:03:30,439 --> 00:03:31,879
Con un texto Lorem Ius

52
00:03:31,879 --> 00:03:32,599
¿Vale?

53
00:03:34,099 --> 00:03:36,780
Entonces, vamos a imaginarnos que yo quiero modificar

54
00:03:36,780 --> 00:03:39,680
Y quiero poner color, por ejemplo

55
00:03:39,680 --> 00:03:41,680
Aumentar el tamaño de letra, ¿vale?

56
00:03:42,039 --> 00:03:45,960
En la cabecera H2 y en el segundo párrafo, ¿vale?

57
00:03:46,800 --> 00:03:48,379
Entonces, lo normal

58
00:03:48,379 --> 00:03:50,400
Pero solo quiero modificar en este párrafo

59
00:03:50,400 --> 00:03:52,500
No quiero modificar en el párrafo anterior, ¿vale?

60
00:03:52,500 --> 00:03:58,840
Por lo tanto, a este párrafo le voy a poner un id que va a ser intro, ¿vale? id intro.

61
00:03:59,759 --> 00:04:07,939
Entonces, si nosotros quisiéramos modificar el tamaño de letra y poner el mismo tamaño de letra tanto en el párrafo intro como en la cabecera h2, ¿vale?

62
00:04:07,939 --> 00:04:17,480
Lo normal sería utilizar dos selectores, uno para h2 y otro para el párrafo, pero con hojas de estilo podemos utilizar los selectores múltiples, ¿vale?

63
00:04:19,300 --> 00:04:21,819
Selectores múltiples, ¿vale?

64
00:04:22,500 --> 00:04:30,060
Que esto aplica el estilo a varios selectores utilizando la coma, ¿vale?

65
00:04:30,060 --> 00:04:35,259
Es decir, nosotros pondríamos, por ejemplo, primero el selector H2, ¿vale?

66
00:04:35,379 --> 00:04:39,800
Y a continuación el selector correspondiente a intro, ¿vale?

67
00:04:40,180 --> 00:04:46,420
Y dentro de aquí pondríamos font-size, por ejemplo, 25 píxeles, ¿vale?

68
00:04:47,879 --> 00:04:49,699
Y fijaros como ha aumentado el tamaño.

69
00:04:49,699 --> 00:04:53,040
No se ve mucho en la cabecera H2 porque este ya tiene un tamaño grande, ¿vale?

70
00:04:53,060 --> 00:04:56,879
Pero para que lo veáis, si pongo 50, se cambian los dos, ¿vale?

71
00:04:58,100 --> 00:05:01,000
Puedo poner 35 para que no quede excesivamente grande.

72
00:05:04,170 --> 00:05:07,310
Esto, pues, permite tener el código mucho más ordenado, ¿vale?

73
00:05:07,490 --> 00:05:11,290
Y permite modificar diferentes...

74
00:05:11,810 --> 00:05:20,009
Permite hacer las mismas modificaciones sobre diferentes selectores sin necesidad de tener que repetir ese código, ¿vale?

75
00:05:20,009 --> 00:05:22,569
¿Qué más?

76
00:05:23,009 --> 00:05:25,430
Vamos a ver ahora el selector descendiente

77
00:05:25,430 --> 00:05:26,829
Para ello vamos a meter

78
00:05:26,829 --> 00:05:29,089
Un fragmento nuevo de código

79
00:05:29,089 --> 00:05:30,290
Vamos a meter un elemento div

80
00:05:30,290 --> 00:05:32,790
Ya dijimos que los elementos div

81
00:05:32,790 --> 00:05:35,209
Se utilizaban

82
00:05:35,209 --> 00:05:36,689
Para organizar el código

83
00:05:36,689 --> 00:05:39,430
Si estamos utilizando

84
00:05:39,430 --> 00:05:41,170
Siempre es recomendable utilizar

85
00:05:41,170 --> 00:05:43,509
Elementos que sean propios de HTML5

86
00:05:43,509 --> 00:05:45,550
Dijimos que el div cada vez se utiliza menos

87
00:05:45,550 --> 00:05:47,089
Pero no significa que no se utilice

88
00:05:47,089 --> 00:05:49,230
De hecho es recomendable para organizar el código

89
00:05:49,230 --> 00:05:53,089
Pero siempre que se pueda se utiliza en elementos HTML5, ¿vale?

90
00:05:53,829 --> 00:06:00,449
Entonces, dentro de este elemento div lo que vamos a hacer es añadir otra nueva cabecera H2, ¿vale?

91
00:06:00,610 --> 00:06:09,410
Vamos a añadir una cabecera H2 en la que ponemos esto es un encabezado H2, ¿vale?

92
00:06:09,889 --> 00:06:17,829
Vamos a añadir un párrafo con un texto lorem ipsum, ¿vale?

93
00:06:17,829 --> 00:06:44,319
Vamos a añadir un segundo párrafo con estos textos de Loren Ibsen, ¿vale? Y fuera del elemento div vamos a poner otro párrafo y otro segundo párrafo. Así, ¿vale? De tal forma que fijaros, esto es el texto que tenemos, ¿vale?

94
00:06:44,319 --> 00:06:47,680
gráficamente veis que no hay ninguna diferencia

95
00:06:47,680 --> 00:06:50,060
es decir, yo no distingo los párrafos que están en el div

96
00:06:50,060 --> 00:06:50,899
que los que no están

97
00:06:50,899 --> 00:06:54,060
pero sí, en el procesamiento de la web

98
00:06:54,060 --> 00:06:55,819
sí que lo entiende y lo diferencia, ¿vale?

99
00:06:56,639 --> 00:06:58,759
entonces, lo que ahora vamos a hacer es modificar

100
00:06:58,759 --> 00:07:00,100
únicamente

101
00:07:00,100 --> 00:07:05,139
el color de fondo de los párrafos que están dentro del div

102
00:07:05,139 --> 00:07:05,600
¿vale?

103
00:07:05,920 --> 00:07:08,360
pues para eso vamos a utilizar un tipo de selector

104
00:07:08,360 --> 00:07:10,980
que es el selector descendiente, ¿vale?

105
00:07:11,800 --> 00:07:13,120
entonces me vengo aquí

106
00:07:13,120 --> 00:07:31,100
Voy a poner comentarios y pongo selector descendiente, que solo afecta a los párrafos dentro del elemento div.

107
00:07:31,480 --> 00:07:37,839
¿Y cómo hacemos esto? Pues en primer lugar ponemos el elemento en concreto, en este caso el div, ¿vale?

108
00:07:37,839 --> 00:07:40,860
Bueno, el elemento contenedor, digamos.

109
00:07:41,139 --> 00:07:44,180
Y ahora ponemos los elementos que queremos que se vean afectados.

110
00:07:44,279 --> 00:07:48,399
En este caso solo queremos los párrafos, por lo tanto pondríamos P, ¿vale?

111
00:07:48,680 --> 00:07:52,079
Y ahora ponemos nuestra llave, ¿vale?

112
00:07:52,680 --> 00:07:59,339
¿Que queremos cambiar el color del fondo? Pues recuerdo, background color, en este caso vamos a poner blue, ¿vale?

113
00:07:59,920 --> 00:08:06,399
Y que queremos cambiar también el color de la fuente, pues color, dos puntos, white, ¿vale?

114
00:08:06,399 --> 00:08:18,800
Entonces, fijaros que esta modificación solo está ocurriendo en los párrafos dentro de nuestro encabezado, ¿vale?

115
00:08:18,800 --> 00:08:27,540
De nuestro elemento div. Sin embargo, por ejemplo, en el encabezado h2 no está ocurriendo a pesar de estar dentro de ese elemento div, ¿vale?

116
00:08:29,540 --> 00:08:37,340
¿Ok? Bueno, ahora lo que vamos a ver es otro tipo de selector que es el selector de hijos, ¿vale?

117
00:08:37,340 --> 00:08:40,179
para ello vamos a utilizar

118
00:08:40,179 --> 00:08:42,220
para explicar bien y que podamos ver bien

119
00:08:42,220 --> 00:08:44,100
la diferencia entre un selector descendente

120
00:08:44,100 --> 00:08:46,179
y un selector de hijos, vamos a crear

121
00:08:46,179 --> 00:08:48,059
una lista, ¿vale? una lista ordenada

122
00:08:48,059 --> 00:08:49,220
la vamos a tener aquí debajo, ¿vale?

123
00:08:49,779 --> 00:08:51,820
entonces recuerdo, pongo L, ¿vale?

124
00:08:53,039 --> 00:08:54,299
y ahora voy a

125
00:08:54,299 --> 00:08:56,259
meter elementos L, ¿vale?

126
00:08:56,480 --> 00:08:57,980
en un primer elemento voy a poner

127
00:08:57,980 --> 00:08:59,720
por ejemplo, vegetales

128
00:08:59,720 --> 00:09:00,320
¿vale?

129
00:09:02,940 --> 00:09:03,840
voy a poner

130
00:09:03,840 --> 00:09:06,039
otro segundo elemento L y que van a

131
00:09:06,039 --> 00:09:15,700
hacer, estos ventanes, ¿no? Vamos a poner un segundo elemento de ahí que van a ser

132
00:09:15,700 --> 00:09:22,779
frutas, ¿vale? Debajo de frutas vamos a crear una lista no ordenada, ¿vale? Por ejemplo,

133
00:09:22,779 --> 00:09:36,820
que va a tener, pues, manzanas, va a tener uvas y va a tener fresas, ¿vale? ¿Ok? Ahora

134
00:09:36,820 --> 00:09:41,639
mismo no veis las puntuaciones ni nada de eso porque hemos quitado todos los márgenes y todo

135
00:09:41,639 --> 00:09:52,679
el pattern. De hecho, si yo cojo esto y lo comento, vamos a comentarlo un segundito, fijaros que ahora

136
00:09:52,679 --> 00:10:02,460
sí aparece. En cuanto lo he comentado han aparecido. Es para que veáis que los efectos afectan mucho

137
00:10:02,460 --> 00:10:15,139
¿Vale? Los estilos. ¿Vale? Ok. Vale. Y debajo de esa lista, pues seguimos escribiendo y vamos a escribir, pues, verduras. ¿Vale? Que sea un poco repetitivo con esto.

138
00:10:15,139 --> 00:10:23,840
Pero bueno, ok, entonces, vamos a hacer una lista, un selector de hijos, ¿vale?

139
00:10:24,059 --> 00:10:33,320
¿Qué es un selector de hijos? Un selector de hijos va a afectar solo a los elementos que dependan directamente de otros, ¿vale?

140
00:10:33,759 --> 00:10:40,620
Y me voy a explicar para que lo veáis bien, y luego vamos a hacer la comparativa con un selector descendiente, ¿vale?

141
00:10:40,620 --> 00:10:43,620
O primero vamos a hacer la comparativa con un selector descendiente, ¿vale?

142
00:10:43,620 --> 00:10:51,860
Vamos a imaginarnos que yo solo quiero afectar a los elementos LI que están debajo del elemento OL, ¿vale?

143
00:10:51,860 --> 00:10:54,379
El elemento de la lista ordenada, ¿vale?

144
00:10:54,960 --> 00:11:00,679
Entonces, yo lo que haría sería poner, si utilizar un selector descendiente, ¿vale?

145
00:11:01,500 --> 00:11:09,139
Pondría OL, luego espacio, LI, y ahora pondría entre llaves lo que quiero que ocurra, ¿vale?

146
00:11:09,159 --> 00:11:12,580
En este caso, pues lo que quiero es cambiar el color de la fuente y que sea rojo, ¿vale?

147
00:11:13,620 --> 00:11:16,879
Y fijaros, fijaros lo que ha pasado, ¿vale?

148
00:11:17,200 --> 00:11:27,419
Al ponerlo al igual que un selector descendiente, me ha modificado todos los elementos LI que hay debajo de este elemento OL, ¿vale?

149
00:11:28,340 --> 00:11:34,759
Sin embargo, si yo quisiera aplicar solo a los LI que pertenecen, cuyo padre sea OL, ¿vale?

150
00:11:34,879 --> 00:11:40,399
Y no me cogiera estos de aquí, cuyo padre es OL, tengo que utilizar el selector de hijos.

151
00:11:40,639 --> 00:11:42,179
¿Cómo se utiliza ese selector de hijos?

152
00:11:42,179 --> 00:11:44,899
muy sencillo, poniendo la tecla

153
00:11:44,899 --> 00:11:47,000
de mayor, poniendo el carácter

154
00:11:47,000 --> 00:11:47,639
mayor que

155
00:11:47,639 --> 00:11:50,779
¿vale? fijaros que ha sido poner

156
00:11:50,779 --> 00:11:52,919
el mayor que y solo me aparecen

157
00:11:52,919 --> 00:11:55,220
ahora vegetales, frutas

158
00:11:55,220 --> 00:11:56,600
y verduras

159
00:11:56,600 --> 00:11:58,139
que realmente es verdura

160
00:11:58,139 --> 00:12:01,909
¿vale? ok

161
00:12:01,909 --> 00:12:04,250
para que veáis la diferencia

162
00:12:04,250 --> 00:12:07,029
¿vale? es importante que entendamos

163
00:12:07,029 --> 00:12:07,629
esta diferencia

164
00:12:07,629 --> 00:12:10,789
vale, ahora vamos a ver el selector hermano

165
00:12:10,789 --> 00:12:12,429
o el selector adyacente

166
00:12:12,429 --> 00:12:13,590
¿vale? como lo queráis llamar

167
00:12:13,590 --> 00:12:23,429
Antes de eso, como hemos hecho antes, voy a quitar estos valores del selector universal para que se vea la web un poquito mejor ahora mismo.

168
00:12:25,710 --> 00:12:35,070
Vamos a imaginarnos un selector hermano, un selector adyacente, digamos que es el que afecte al elemento que haya justo después de otro.

169
00:12:35,070 --> 00:12:41,269
En este caso, yo quiero modificar el párrafo que hay justo después de este elemento div.

170
00:12:41,269 --> 00:13:10,100
Entonces, si yo quiero poner un selector hermano o un selector adyacente, lo voy a escribir aquí, selector adyacente, esto lo que va a hacer es modificar el elemento que se encuentra hermano, lo pongo entre comillas, o justo inmediatamente después de otro.

171
00:13:10,100 --> 00:13:27,200
¿Vale? Entonces, nosotros pondríamos primero el elemento anterior al que queremos modificar, ¿vale? Yo quiero modificar el párrafo que hay justo después del párrafo del elemento div, ¿vale?

172
00:13:27,200 --> 00:13:32,879
Es decir, quiero modificar este párrafo, pero no quiero que me modifique este, el siguiente, ¿vale?

173
00:13:33,139 --> 00:13:38,080
Entonces pongo aquí div y ahora pongo p, ¿vale?

174
00:13:38,559 --> 00:13:43,259
Y lo que voy a modificar en este caso, voy a poner un color de fondo así en un tipo verde, ¿vale?

175
00:13:43,440 --> 00:13:46,799
Con background, color, ¿vale?

176
00:13:49,269 --> 00:13:50,070
Sigue, ¿vale?

177
00:13:50,169 --> 00:13:55,029
Y fijaros que solo me ha modificado ese párrafo, ¿vale?

178
00:13:55,029 --> 00:14:08,090
Ahora, sin embargo, si yo quiero modificar todos los elementos P que haya después de ese div, ¿vale?

179
00:14:09,110 --> 00:14:16,990
¿Ok? Es decir, si yo quiero hacer lo que se llama un selector hermano general, ¿vale?

180
00:14:16,990 --> 00:14:25,870
Es decir, que modifica cualquier elemento P que se encuentre en el mismo nivel jerárquico, ¿vale?

181
00:14:27,840 --> 00:14:30,139
Del elemento dip, ¿vale?

182
00:14:30,220 --> 00:14:33,179
Es decir, a la misma altura, no los que estén por debajo.

183
00:14:33,460 --> 00:14:37,980
Entonces, en este sentido, me va a modificar también algunos otros párrafos, fijaros, ¿vale?

184
00:14:38,919 --> 00:14:41,159
Yo tengo dip, pondría dip, ¿vale?

185
00:14:41,899 --> 00:14:45,639
Y ahora pondría el símbolo, el burrumillo ese, ¿vale?

186
00:14:45,639 --> 00:14:52,399
Que se pone con la tecla Alt-G-R, que es la que está a la derecha del espacio, y el 4, ¿vale?

187
00:14:52,700 --> 00:14:55,159
Le damos dos veces para que aparezca y ahí lo tenemos.

188
00:14:55,259 --> 00:14:59,340
Y ahora pondríamos el párrafo en sí, ¿vale?

189
00:14:59,659 --> 00:15:02,519
Y ahora aquí, por ejemplo, lo que hace es cambiar el tamaño de letra.

190
00:15:02,740 --> 00:15:07,100
Voy a poner un tamaño de 25 píxeles, ¿vale?

191
00:15:07,100 --> 00:15:31,279
Y fijaros que me ha modificado los dos párrafos de a continuación. ¿Vale? Los dos párrafos de a continuación. ¿Ok? Esto es simplemente para que sepáis otras formas en las cuales podéis hacer referencia a esos elementos. ¿Vale?

192
00:15:31,279 --> 00:15:38,220
Ahora lo que vamos a hacer es ver otro tipo de selectores, que es el selector de atributos, ¿vale?

193
00:15:38,740 --> 00:15:46,360
Para esto, este tipo de selector, perdón, funciona modificando el estilo dependiendo de los atributos del elemento, ¿vale?

194
00:15:46,639 --> 00:15:50,559
Vamos a verlo con un ejemplo, vamos a verlo con el ejemplo de los enlaces, ¿vale?

195
00:15:50,899 --> 00:15:54,799
Entonces nos vamos a ir a la web, a la parte donde estamos poniendo contenido, ¿vale?

196
00:15:55,100 --> 00:15:59,299
Y aquí vamos a crear tres enlaces, ¿vale?

197
00:15:59,980 --> 00:16:05,659
Estos enlaces, pues, vamos a poner, como siempre ponemos la almohadilla como nombre del enlace, ¿vale?

198
00:16:05,940 --> 00:16:09,080
Este primero vamos a poner enlace 1, ¿vale?

199
00:16:09,720 --> 00:16:11,039
Ponemos un salto de línea.

200
00:16:12,639 --> 00:16:15,120
Vamos a poner un segundo enlace, ¿vale?

201
00:16:15,620 --> 00:16:16,919
Con el texto enlace 2.

202
00:16:17,240 --> 00:16:18,919
Y a este le vamos a poner un atributo.

203
00:16:19,019 --> 00:16:21,820
Le vamos a poner el atributo target, ¿vale?

204
00:16:22,259 --> 00:16:23,259
El atributo target.

205
00:16:23,799 --> 00:16:28,019
Y le vamos a dar un valor que va a ser barra baja blanca, ¿vale?

206
00:16:28,019 --> 00:16:45,080
Vamos a ponerle otro salto de línea y ponemos un tercer enlace, también con el atributo target, pero en este caso con el valor barra baja, sell, ¿vale? Y ponemos enlace 3, ¿vale?

207
00:16:45,080 --> 00:16:57,899
Y lo que vamos a hacer ahora es modificar el estilo de aquellos elementos A que tengan el atributo target, independientemente de lo que va de la target, ¿vale?

208
00:16:58,379 --> 00:17:04,000
Entonces, nos venimos aquí, como digo, esto va a ser un selector por atributos, ¿vale?

209
00:17:04,180 --> 00:17:13,759
Un selector de atributos que se utiliza poniendo entre corchetes el nombre del atributo, ¿vale?

210
00:17:14,720 --> 00:17:21,039
Entonces, en este caso, nosotros pondríamos primero el nombre del elemento, que como es un enlace, ponemos A, ¿vale?

211
00:17:21,259 --> 00:17:25,740
Y entre paréntesis, el nombre del atributo, en este caso, target, ¿vale?

212
00:17:27,200 --> 00:17:31,220
Entonces, para que lo veamos, vamos a hacerlo primero con un selector general.

213
00:17:31,220 --> 00:17:37,180
Pondríamos A, yo pongo aquí color, ¿vale? 2.3, ¿vale?

214
00:17:37,259 --> 00:17:40,680
Y fijaros que el color del enlace ha cambiado, ¿vale?

215
00:17:40,680 --> 00:17:44,299
O pongo green y el color del enlace ha cambiado.

216
00:17:44,539 --> 00:17:55,039
Ahora, si yo solo quiero modificar aquellos que tienen el atributo target, pongo entre corchetes, tal.

217
00:17:55,759 --> 00:18:02,259
Y fijaros que ahora solo se me modifica el color de los elementos enlace 2 y enlace 3, ¿vale?

218
00:18:02,259 --> 00:18:20,400
¿Vale? Ok. Eso en cuanto a modificar solo aquel que tenga el atributo target. Pero también podemos hacer, modificar, hacer un selector de atributos con un valor concreto, ¿vale?

219
00:18:20,400 --> 00:18:28,079
Que sería igual, ponemos entre corchetes el atributo que queremos comparar, igual al valor, ¿vale?

220
00:18:28,559 --> 00:18:31,200
Entonces, en este caso, vamos a hacer lo mismo.

221
00:18:31,460 --> 00:18:40,880
Vamos a modificar el valor de target, pero solo para aquel que tenga el valor self, ¿vale?

222
00:18:41,720 --> 00:18:43,380
Solo para el que tenga el valor self.

223
00:18:43,680 --> 00:18:47,440
Y en este caso le vamos a poner un enlace rojo, ¿vale?

224
00:18:47,440 --> 00:19:03,140
Entonces, fijaros, tengo yo ahora mismo tres enlaces diferentes, ¿vale? Y cada uno con un color diferente, azul, verde y rojo. ¿Ok? Esto a cuanto al selector de atributos.

225
00:19:03,140 --> 00:19:17,019
Otra forma de dar valor a estos selectores por atributos es utilizando, dándole, haciendo una comparativa por qué palabra o por qué letra empieza, ¿vale?

226
00:19:17,019 --> 00:19:23,339
Lo voy a explicar también con un ejemplo, pero para eso primero vamos a crear contenido nuevo, ¿vale?

227
00:19:23,380 --> 00:19:26,859
Debajo de estos enlaces, voy a poner aquí un salto de línea, ¿vale?

228
00:19:27,220 --> 00:19:32,079
Vamos a añadir un nuevo párrafo, ¿vale? Con un texto lorem ipsum.

229
00:19:32,940 --> 00:19:37,259
Y aquí vamos a poner el atributo class, ¿vale?

230
00:19:38,180 --> 00:19:45,940
Y como contenido este, como texto de lo que vamos a poner en este atributo va a ser destacado, ¿vale?

231
00:19:47,019 --> 00:19:56,579
Vamos a añadir otro párrafo más, también con texto Lorem Ipsum, y en este caso la clase va a ser especial destacado, ¿vale?

232
00:19:57,240 --> 00:20:10,880
Y por último, vamos a añadir otro párrafo más, también con texto Lorem Ipsum, y con una clase que va a ser, en este caso, destacado principal, ¿vale?

233
00:20:10,880 --> 00:20:31,799
Y ahora lo que yo quiero es modificar, ¿vale? Modificar el atributo de... Modificar aquellos párrafos solo los que empiecen por la palabra destacar, ¿vale? En los que la clase empiece por la palabra destacar, ¿vale? Esto sigue siendo un selector de atributos, ¿vale?

234
00:20:31,799 --> 00:20:44,660
Es un selector de atributos en el que lo que yo comparo es el comienzo de palabra, ¿vale?

235
00:20:44,759 --> 00:20:46,259
Por comienzo de palabra.

236
00:20:46,779 --> 00:20:48,140
¿Y esto cómo se hace?

237
00:20:49,440 --> 00:20:54,960
Pues se hace poniendo entre corchetes el nombre del atributo, ¿vale?

238
00:20:55,099 --> 00:20:59,539
El nombre del atributo y vamos a poner el circunflejo, ¿vale?

239
00:20:59,539 --> 00:21:03,039
Y luego el igual.

240
00:21:03,180 --> 00:21:06,019
Y entre paréntesis, el valor que queremos, ¿vale?

241
00:21:06,319 --> 00:21:12,900
Entonces, yo pondría en este caso, como la clase es, como el tipo es una etiqueta P, ¿vale?

242
00:21:13,759 --> 00:21:21,440
Entre llaves, entre cochetes, perdón, pondría el atributo, en este caso, class, el circunflejo, ¿vale?

243
00:21:21,500 --> 00:21:25,359
Que para que no sepa suponer que la tecla mayúscula y la tecla que hay a la derecha de la P,

244
00:21:26,519 --> 00:21:28,539
luego pondríamos igual, ¿vale?

245
00:21:28,900 --> 00:21:33,019
Y entre comillas pondría destacado, ¿vale?

246
00:21:33,180 --> 00:21:45,099
Ahora pongo, abro llave y cierro llave, y dentro voy a poner un color de fondo, background color, amarillo, ¿vale?

247
00:21:51,279 --> 00:22:03,579
Entonces, fijaros que solo me ha modificado los párrafos, el primero y el tercero de aquí, que son el que solo tiene destacado y aquel que tiene destacado principal, ¿vale?

248
00:22:04,220 --> 00:22:05,380
Destacado principal.

249
00:22:05,380 --> 00:22:12,420
De esta misma forma se puede hacer lo mismo en el sentido contrario, ¿vale?

250
00:22:13,079 --> 00:22:17,579
Entonces, para eso vamos a hacer un ejemplo, ¿vale?

251
00:22:17,900 --> 00:22:21,759
Es decir, podemos utilizar en vez de por el comienzo de una palabra, por el fin de una palabra.

252
00:22:22,339 --> 00:22:24,519
Eso lo vamos a hacer creando nuevos valores.

253
00:22:24,640 --> 00:22:26,559
Otra vez vamos a utilizar aquí el enlace, ¿vale?

254
00:22:27,099 --> 00:22:31,119
Voy a crear un primer enlace a una dirección, ¿vale?

255
00:22:31,119 --> 00:22:33,119
Que va a ser http...

256
00:22:33,119 --> 00:22:37,779
Bueno, voy a buscar aquí en el navegador, voy a buscar la dirección de google.es, ¿vale?

257
00:22:38,500 --> 00:22:41,440
Y lo que hago es que la copio y la pego, ¿vale?

258
00:22:41,880 --> 00:22:43,519
Fijaros que aparece ahí google.es.

259
00:22:44,220 --> 00:22:49,500
Voy a coger otra, que es el diario.es, ¿vale?

260
00:22:54,339 --> 00:22:55,619
Y creo otro enlace.

261
00:22:56,299 --> 00:22:58,740
Perdona, es que se me había creado otro enlace, ¿vale?

262
00:22:58,740 --> 00:23:04,019
Y voy a coger otra, que va a ser, por ejemplo, marca.com, ¿vale?

263
00:23:07,640 --> 00:23:08,160
Ahí.

264
00:23:08,160 --> 00:23:10,480
Creo otro enlace

265
00:23:10,480 --> 00:23:12,019
Y lo pego

266
00:23:12,019 --> 00:23:14,140
¿Vale?

267
00:23:14,700 --> 00:23:20,480
Vale

268
00:23:20,480 --> 00:23:22,099
Y voy a poner aquí

269
00:23:22,099 --> 00:23:23,539
Como texto

270
00:23:23,539 --> 00:23:24,099
¿Vale?

271
00:23:24,339 --> 00:23:24,960
Del enlace

272
00:23:24,960 --> 00:23:25,839
Voy a poner Google

273
00:23:25,839 --> 00:23:28,240
Voy a poner un salto de línea

274
00:23:28,240 --> 00:23:31,779
Voy a poner el diario

275
00:23:31,779 --> 00:23:36,759
Y pongo un salto de línea

276
00:23:36,759 --> 00:23:38,039
¿Vale?

277
00:23:38,039 --> 00:23:39,720
Y voy a poner

278
00:23:39,720 --> 00:23:41,500
Marca

279
00:23:41,500 --> 00:23:44,960
Y pongo otro salto de línea

280
00:23:44,960 --> 00:23:49,660
Ahí está

281
00:23:49,839 --> 00:24:01,039
¿Vale? Pongo eso. Entonces, lo que voy a hacer ahora, ¿vale? Bueno, voy a quitar esta barra de final porque tampoco son necesarias, ¿vale?

282
00:24:01,220 --> 00:24:10,440
Lo que voy a hacer ahora es modificar el color de aquellos enlaces en los que el atributo href termine en .es, ¿vale?

283
00:24:10,960 --> 00:24:17,799
Es decir, en este caso, solo se me debería de modificar el enlace de Google y el enlace del diario, ¿vale?

284
00:24:17,799 --> 00:24:32,450
Entonces, para eso, el procedimiento es parecido, ¿vale? Sería de nuevo un selector de atributos por fin de palabra, ¿vale?

285
00:24:32,450 --> 00:24:56,970
Y en este caso, pues pondríamos en primer lugar el tipo, que es el A, ¿vale? Luego pondríamos el atributo, que es href, ¿vale? No lo he puesto aquí como se hace, perdonad, ¿vale? Sería entre llaves, el atributo y en vez de poner el circunflejo que hemos puesto antes, aquí vamos a poner el símbolo de dólar, ¿vale? Ponemos igual y entre paréntesis el valor, ¿vale?

286
00:24:56,970 --> 00:25:04,829
Entonces, yo pondría href, símbolo de dólar, igual, y entre paréntesis, .es, ¿vale?

287
00:25:05,650 --> 00:25:11,509
Y a este, por ejemplo, pues le voy a cambiar el color y le voy a poner rojo oscuro, ¿vale?

288
00:25:12,369 --> 00:25:17,450
Y no se ve mucho porque los enlaces los tenía visitados, entonces aquí aparecen morados, ¿vale?

289
00:25:17,670 --> 00:25:22,289
Lo que voy a hacer también es aumentarle el tamaño para que veáis que ese efecto se está produciendo, ¿vale?

290
00:25:22,289 --> 00:25:25,029
Voy a poner aquí, por ejemplo, 15 píxeles, ¿vale?

291
00:25:25,029 --> 00:25:28,130
os voy a poner 20 píxeles

292
00:25:28,130 --> 00:25:30,029
¿vale?

293
00:25:30,490 --> 00:25:31,829
fijaros que ahora si se ve

294
00:25:31,829 --> 00:25:33,970
que solo estoy afectando a esos

295
00:25:33,970 --> 00:25:35,710
dos elementos, a los elementos que

296
00:25:35,710 --> 00:25:37,730
terminan en .es

297
00:25:37,730 --> 00:25:39,849
¿vale? tanto Google como, pero solo

298
00:25:39,849 --> 00:25:41,890
a los elementos cuyos atributos terminan

299
00:25:41,890 --> 00:25:43,710
en .es, ¿vale? no nos confundamos

300
00:25:43,710 --> 00:25:44,990
¿vale?

301
00:25:48,720 --> 00:25:50,740
vale, eh, otro

302
00:25:50,740 --> 00:25:52,759
otra cosa que podemos

303
00:25:52,759 --> 00:25:54,940
hacer, eh, vamos a

304
00:25:54,940 --> 00:25:55,859
mmm

305
00:25:55,859 --> 00:26:02,720
Es otro selector de atributos, ¿vale?

306
00:26:02,759 --> 00:26:06,259
Pero en este aspecto vamos a coger cualquier parte de contenido, ¿vale?

307
00:26:07,039 --> 00:26:09,799
Y como digo, esto la mejor forma de entenderlo es con un ejemplo.

308
00:26:09,799 --> 00:26:14,119
Y para eso nos vamos a hacer una lista no ordenada, ¿vale?

309
00:26:14,579 --> 00:26:15,480
Con ul.

310
00:26:16,579 --> 00:26:20,900
Y ahora debajo vamos a poner, por ejemplo, vamos a poner cuatro términos.

311
00:26:21,259 --> 00:26:22,700
li4, tabulador.

312
00:26:22,880 --> 00:26:23,240
Uy, no.

313
00:26:24,079 --> 00:26:25,359
Yo me equivoco con esto.

314
00:26:25,359 --> 00:26:28,420
li por 4

315
00:26:28,420 --> 00:26:29,940
tabulador, ahí, ¿vale?

316
00:26:30,640 --> 00:26:32,380
y vamos a poner curso

317
00:26:32,380 --> 00:26:34,119
de php, ¿vale?

318
00:26:36,019 --> 00:26:36,500
curso

319
00:26:36,500 --> 00:26:37,880
de java

320
00:26:37,880 --> 00:26:40,460
curso de

321
00:26:40,460 --> 00:26:44,259
pintura y

322
00:26:44,259 --> 00:26:46,319
sueña

323
00:26:46,319 --> 00:26:48,460
con ser mejor

324
00:26:48,460 --> 00:26:50,079
¿vale? alguna chorrada

325
00:26:50,079 --> 00:26:52,339
vale, y

326
00:26:52,339 --> 00:26:54,460
dentro de este elemento li

327
00:26:54,460 --> 00:26:55,539
vamos a poner

328
00:26:55,539 --> 00:26:57,660
el atributo title, ¿vale?

329
00:26:58,500 --> 00:27:00,559
Y ahora aquí, por ejemplo, a este primero

330
00:27:00,559 --> 00:27:02,259
vamos a poner curso.php

331
00:27:02,259 --> 00:27:04,720
A este segundo

332
00:27:04,720 --> 00:27:06,680
vamos a ponerle un atributo

333
00:27:06,680 --> 00:27:07,920
title que va a ser

334
00:27:07,920 --> 00:27:10,039
nuevo curso

335
00:27:10,039 --> 00:27:11,980
de C++, ¿vale?

336
00:27:13,740 --> 00:27:14,559
O un nuevo curso

337
00:27:14,559 --> 00:27:15,359
de Java, perdón.

338
00:27:18,519 --> 00:27:21,240
A este le vamos a poner un atributo title que va a ser

339
00:27:21,240 --> 00:27:24,039
cursos, ¿vale?

340
00:27:24,039 --> 00:27:26,059
Lo voy a llamar en plural para que veamos

341
00:27:26,059 --> 00:27:35,440
la diferencia cursos de pintura vale y a este último vamos a poner

342
00:27:35,440 --> 00:27:40,059
aprende se mejor

343
00:27:40,059 --> 00:27:45,619
ok pues lo que vamos a hacer ahora es modificar el estilo de todos los

344
00:27:45,619 --> 00:27:58,420
elementos de l y que tengan parte de su texto sea curva cv entonces nos vamos a

345
00:27:58,420 --> 00:28:05,420
nuestro destino y como digo esto es un selector de atributos vamos a llamarlo

346
00:28:05,420 --> 00:28:15,599
selector de atributos por palabra en cualquier posición vale y se hace de

347
00:28:15,599 --> 00:28:20,880
nuevo ponemos llaves ponemos corchetes perdón y en este caso pondremos el

348
00:28:20,880 --> 00:28:26,920
atributo y un asterisco vale y luego el valor que queramos en sí

349
00:28:26,920 --> 00:28:31,759
ok total que lo que vamos a poner es

350
00:28:31,759 --> 00:28:37,599
pondríamos el ee y vale porque es el elemento que queremos modificar

351
00:28:37,599 --> 00:28:44,799
y entre corchetes pondríamos el title asterisco igual que ahora ponemos

352
00:28:44,799 --> 00:28:47,019
¿Vale? Abrimos y cerramos

353
00:28:47,019 --> 00:28:49,099
Y a este

354
00:28:49,099 --> 00:28:51,480
La modificación de estilo que le vamos a hacer

355
00:28:51,480 --> 00:28:53,039
Aumentarle el tamaño ¿Vale?

356
00:28:54,000 --> 00:28:55,700
Y lo vamos a poner a 22 píxeles

357
00:28:55,700 --> 00:28:56,500
¿Vale?

358
00:28:57,519 --> 00:29:00,019
Y fijaros que las modificaciones

359
00:29:00,019 --> 00:29:01,119
Solo se está haciendo

360
00:29:01,119 --> 00:29:02,920
En los tres elementos

361
00:29:02,920 --> 00:29:05,579
Que tenía la palabra

362
00:29:05,579 --> 00:29:06,799
Cur ¿Vale?

363
00:29:07,420 --> 00:29:09,220
Si fijaros que yo pongo ahora

364
00:29:09,220 --> 00:29:11,599
Eh...

365
00:29:11,599 --> 00:29:12,619
Fijaros que tontería

366
00:29:12,619 --> 00:29:21,819
Si yo pusiera aquí en el title C, mejor, curioso, fijaros cómo se ha cambiado automáticamente, ¿vale?

367
00:29:22,559 --> 00:29:29,660
No tiene que ver con que sea curso, tendría que ser que tuviera la palabra CUR, la cadena CUR, C-U-R, ¿vale?

368
00:29:31,460 --> 00:29:35,849
¿Ok? Vale, vale, vale.

369
00:29:37,690 --> 00:29:43,789
Vale, pues ahora lo que vamos a ver es cómo modificar un párrafo, ¿vale? En este caso un párrafo.

370
00:29:44,769 --> 00:29:48,789
que contiene un valor de atributo, ¿vale?

371
00:29:49,650 --> 00:29:53,730
Un valor concreto y que está diferenciado.

372
00:29:53,990 --> 00:29:56,910
Y lo vamos a ver de nuevo, la mejor forma de explicarlo es con un ejemplo.

373
00:29:57,730 --> 00:29:59,210
Para que vosotros podáis entenderlo, ¿vale?

374
00:29:59,789 --> 00:30:03,170
Voy a crear un nuevo párrafo aquí debajo, ¿vale?

375
00:30:03,450 --> 00:30:07,470
De los anteriores, que va a tener un texto de Lorentz.

376
00:30:07,470 --> 00:30:13,789
Y en este caso voy a ponerle como clase, voy a poner texto-destacado.

377
00:30:13,789 --> 00:30:18,250
espacio después de ese texto destacado principal

378
00:30:18,250 --> 00:30:24,690
entonces fijaros que estos cuatro párrafos que estoy sombreando

379
00:30:24,690 --> 00:30:27,170
todos tienen la palabra destacado

380
00:30:27,170 --> 00:30:31,829
excepto el último que acabo de crear que tiene texto guión destacado

381
00:30:31,829 --> 00:30:37,009
vale, pues me voy a ir a mi parte de hoja de estilo

382
00:30:37,009 --> 00:30:41,890
y voy a poner otro selector por atributos

383
00:30:41,890 --> 00:30:46,690
cuya etiqueta

384
00:30:46,690 --> 00:30:48,789
que lo vamos a poner tal que así

385
00:30:48,789 --> 00:30:51,130
va a ser ATR, luego va a ser

386
00:30:51,130 --> 00:30:53,089
el burrumillo, el símbolo

387
00:30:53,089 --> 00:30:54,990
de la ñ, que recuerdo que era

388
00:30:54,990 --> 00:30:56,950
ACP4, igual

389
00:30:56,950 --> 00:30:58,029
el valor

390
00:30:58,029 --> 00:31:00,630
y os voy a poner aquí debajo

391
00:31:00,630 --> 00:31:02,069
la explicación de esto

392
00:31:02,069 --> 00:31:04,670
la explicación de esto sería

393
00:31:04,670 --> 00:31:06,710
cualquier, de lo que vamos a hacer

394
00:31:06,710 --> 00:31:08,329
es cualquier elemento p

395
00:31:08,329 --> 00:31:10,549
que contenga el atributo

396
00:31:10,549 --> 00:31:12,630
class, es lo que vamos a hacer

397
00:31:12,630 --> 00:31:14,029
con el valor

398
00:31:14,029 --> 00:31:15,190
destacado

399
00:31:15,190 --> 00:31:18,049
separado por un espacio en blanco

400
00:31:18,049 --> 00:31:20,049
¿vale? es decir

401
00:31:20,049 --> 00:31:21,289
no nos valdría el valor

402
00:31:21,289 --> 00:31:23,950
el último párrafo que hemos creado porque tenía

403
00:31:23,950 --> 00:31:26,089
texto guión destacado

404
00:31:26,089 --> 00:31:29,819
¿vale? y para que veáis

405
00:31:29,819 --> 00:31:30,599
el resultado

406
00:31:30,599 --> 00:31:32,480
¿vale?

407
00:31:33,740 --> 00:31:35,519
me vengo aquí, yo pondría p

408
00:31:35,519 --> 00:31:37,119
abro mis corchetes

409
00:31:37,119 --> 00:31:39,339
pongo el class ¿vale?

410
00:31:40,099 --> 00:31:41,559
pondría el gurrumillo

411
00:31:41,559 --> 00:31:43,660
igual y entre paréntesis

412
00:31:43,660 --> 00:31:45,900
Y entre comillas, perdón, destacado.

413
00:31:47,299 --> 00:31:50,579
Abro llave y pongo un color.

414
00:31:50,799 --> 00:31:51,980
En este caso, el azul.

415
00:31:53,200 --> 00:31:53,359
¿Vale?

416
00:31:53,799 --> 00:31:58,599
Entonces, fijaros que se ha modificado el color de la fuente de todos los párrafos menos del último.

417
00:31:59,539 --> 00:32:00,059
¿Vale?

418
00:32:04,470 --> 00:32:04,990
¿Ok?

419
00:32:05,609 --> 00:32:10,960
Y por último, vamos a ver el último atributo.

420
00:32:11,440 --> 00:32:11,539
¿Vale?

421
00:32:11,619 --> 00:32:13,119
El último selector de atributos.

422
00:32:17,660 --> 00:32:19,599
En este caso, la sintaxis va a ser ACR.

423
00:32:20,559 --> 00:32:20,740
¿Vale?

424
00:32:20,980 --> 00:32:22,359
Y vamos a poner una barra vertical.

425
00:32:22,359 --> 00:32:30,960
La barra vertical se pone con la tecla Alt-G-R, que es la que está a la derecha del espacio, y luego le vamos a dar al número 1, ¿vale?

426
00:32:31,079 --> 00:32:32,660
Y sale esa barra así en vertical.

427
00:32:33,839 --> 00:32:37,539
Entonces pondríamos A-T-R igual y el valor, ¿vale?

428
00:32:37,980 --> 00:32:39,380
¿Y qué es lo que vamos a hacer aquí?

429
00:32:40,299 --> 00:32:47,380
Pues vamos a seleccionar cualquier elemento P cuyo atributo class, ¿vale?

430
00:32:47,380 --> 00:32:53,299
empiece con la palabra texto, ¿vale?

431
00:32:53,819 --> 00:32:58,079
Es decir, pondríamos P, abrimos, cerramos corchete,

432
00:32:59,079 --> 00:33:04,220
CLASS, barra vertical, igual, y ponemos texto.

433
00:33:05,319 --> 00:33:09,400
Y en este caso, esto lo que le vamos a hacer es aumentarle el tamaño de letra

434
00:33:09,400 --> 00:33:12,180
y ponerle 18 píxeles, o en este caso, disminuirla, ¿vale?

435
00:33:12,180 --> 00:33:23,230
Y fijaros que en este caso solo me ha escogido el último valor, ¿vale? El último valor, ¿ok?

436
00:33:23,970 --> 00:33:33,869
Si yo quisiera hacer alguna modificación en alguno de los elementos, ¿vale? Por ejemplo, en el segundo párrafo, si yo pusiera texto, ¿vale?

437
00:33:33,869 --> 00:33:41,410
Fijaros que al poner texto, el tamaño de este elemento no me ha disminuido, ¿vale?

438
00:33:41,890 --> 00:33:43,130
No me ha disminuido.

439
00:33:43,549 --> 00:33:50,049
Entonces, para que me disminuyese, tendría que ser una palabra, ¿vale?

440
00:33:50,170 --> 00:33:52,230
Una palabra que empiece por texto.

441
00:33:52,450 --> 00:33:55,369
Si yo ahora lo pego, tampoco, ¿vale?

442
00:33:55,789 --> 00:34:02,230
Pues tiene que ser, tendría que ser, si yo pusiera texto y un guión, ¿vale?

443
00:34:02,230 --> 00:34:23,130
Para que veáis las diferencias. Esto lo estoy haciendo modificando directamente el atributo a class y me permite mucho juego, ¿vale? Si yo ahora aquí, fijaros, donde pone destacado, quito la tem, me cambia directamente eso, ¿vale? Entonces, todo esto son formas de hacer modificaciones sobre el estilo utilizando selectores, ¿vale?

444
00:34:23,130 --> 00:34:29,030
¿Lo usamos todo a la hora de diseñar una web?

445
00:34:29,329 --> 00:34:33,150
No, utilizaremos los que nos venga bien o los que necesitemos, ¿vale?

446
00:34:33,429 --> 00:34:35,670
No tenemos por qué utilizarlos todos, ¿vale?

447
00:34:35,889 --> 00:34:38,730
Pero es importante que los conozcáis y sepáis que están ahí, ¿vale?

448
00:34:40,269 --> 00:34:40,949
Muy bien.