HTML - Estilos y tipografias

 
Vista:
sin imagen de perfil
Val: 36
Ha mantenido su posición en HTML (en relación al último mes)
Gráfica de HTML

Estilos y tipografias

Publicado por Daniel (9 intervenciones) el 05/02/2020 23:10:15
Buenas,

Estoy necesito de sus conocimientos, estoy queriendo modificar los valores del estilo de h2, h3 y span, como uso el mismo estilo en todo el sitio, al cambiar un valor en la página principal(por ejemplo tamaño de fuente) se me cambia en las demás páginas.

Adjunto el código


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
<!-- COVER IMAGE -->
<div class="cover">
	<!-- titulo -->
	<h1>South Wind Games</h1>
	<!-- fin titulo -->
 
	<!-- subtitulo -->
	<h2>Independent Game Development Studio</h2>
	<!-- fin subtitulo -->
 
	<!-- extra titulos -->
	<h3><span>SKOOP!</span>Get the latest on <b>Oxy8</b></h3>
	<h3><span>ARGENTINA</span> They come from the south...</h3>
	<h3><span>SCANDAL!</span>Team wants pets, Game Director panics!</h3>
	<!-- fin extra titulos -->
 
	<!-- mes y año -->
 
	<script>
		var meses = new Array ("January","February","March","April","May","June","July","August","September","October","November","December");
		var f=new Date();
		document.write('<div class="fecha">' + meses[f.getMonth()] + ' / ' + f.getFullYear() + '<img src="images/logo/SWGBlanco.png" style="width:50px; height:25px; float:right; margin-bottom: 5px; margin-left: 20px;"></div>');
	</script>
 
	<!-- fin mes y año -->
 
	</div>
 
aca sigue el codigo...

Alguna sugerencia o ejemplo para solucionar ese inconveniente seria de buena ayuda.
Muchas gracias por adelantado.
Saludos
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
sin imagen de perfil
Val: 6
Ha disminuido su posición en 7 puestos en HTML (en relación al último mes)
Gráfica de HTML

Estilos y tipografias

Publicado por Marlon (2 intervenciones) el 06/02/2020 04:49:11
sin son varios html, puedes agregar una hoja de estilo solo para el documento que quieres editar .
O en tu CSS puedes hacer esto:
1
2
3
.cover h1, h2, span  {
     color: blue;
}
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil
Val: 36
Ha mantenido su posición en HTML (en relación al último mes)
Gráfica de HTML

Estilos y tipografias

Publicado por Daniel (9 intervenciones) el 07/02/2020 01:35:40
Hola Marlon, gracias por el aporte, probe lo que me recomendaste pero siempre toma el anterior. No se todavia el motivo
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de Julio
Val: 43
Ha disminuido 1 puesto en HTML (en relación al último mes)
Gráfica de HTML

Estilos y tipografias

Publicado por Julio (11 intervenciones) el 06/02/2020 08:39:44
Hola.

¿Sólo quieres modificar el h2, h3 y span dentro del div "cover"? ¿Los h2, h3 y span de fuera no quieres modificarlos?

-----------------------------
Aprende la programación desde una perspectiva básica y simplista en Programación Básica
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil
Val: 36
Ha mantenido su posición en HTML (en relación al último mes)
Gráfica de HTML

Estilos y tipografias

Publicado por Daniel (9 intervenciones) el 07/02/2020 01:41:52
Hola julio,

si, solo los que se encuentran dentro del cover, porque sino se modifica las demas paginas internas
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de Julio
Val: 43
Ha disminuido 1 puesto en HTML (en relación al último mes)
Gráfica de HTML

Estilos y tipografias

Publicado por Julio (11 intervenciones) el 07/02/2020 06:51:03
Hola.

Entonces, como te han sugerido arriba (aunque con una pequeña modificación):

1
2
3
4
5
.cover h2,
.cover h3,
.cover span {
    // ...aquí las reglas CSS
}

-----------------------------
Aprende la programación desde una perspectiva básica y simplista en Programación Básica
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil
Val: 36
Ha mantenido su posición en HTML (en relación al último mes)
Gráfica de HTML

Estilos y tipografias

Publicado por Daniel (9 intervenciones) el 07/02/2020 17:12:17
Hola Julio,

cuando te referis en ...aqui las reglas CSS, decis a todo lo que quiero modificar?

Gracias
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de Julio
Val: 43
Ha disminuido 1 puesto en HTML (en relación al último mes)
Gráfica de HTML

Estilos y tipografias

Publicado por Julio (11 intervenciones) el 07/02/2020 17:24:27
Hola.

Supongo que conocerás lo que es el CSS cuando te has puesto a preguntar sobre modificar los estilos, ¿no? Si no lo conoces, deberías empezar por ahí y lo entenderás todo más fácilmente. Pero sí, ahí tienes que colocar pues colores, márgenes, fondos..., los estilos, en definitiva.

-----------------------------
Aprende la programación desde una perspectiva básica y simplista en Programación Básica
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil
Val: 36
Ha mantenido su posición en HTML (en relación al último mes)
Gráfica de HTML

Estilos y tipografias

Publicado por Daniel (9 intervenciones) el 07/02/2020 21:29:03
Hola Julio, conozco lo que es CSS,
es la primera vez que esto me pasa. Te adjunto como lo tengo en el código:

/*Para todo el sitio*/
1
2
3
4
5
6
7
8
h1, h2, h3, h4, h5, h6 { font-weight: 400; }
h1 { font-size: 2.20em; margin: 0.8em 0 0.4em 0; }
h2 { font-size: 2.00em; margin: 1.0em 0 0.8em 0; }
h3 { font-size: 1.10em; margin: 1.0em 0 .6em 0; }
h4 { font-size: 1.00em; margin: 1.0em 0 .6em 0; }
h5 { font-size: 0.90em; margin: 1.0em 0 .8em 0; }
h6 { font-size: 0.85em; margin: 1.0em 0 .8em 0; }
p { margin: 1.2em 0; }

Solo para el principal:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
/* CSS principal */
.cover {
	position: relative;
	z-index: 1000;
	width: 100%;
	height: 100%;
	overflow: hidden;
	background-color: #04235b;
	box-sizing: border-box;
	border: 10px solid #980002;
	font-weight: bold;
}
 
.cover h2, .cover h3 {
	text-shadow: -1px -1px 1px rgba(0,0,0,0.2),
		1px 1px 0 rgba(0,0,0,0.2),
		2px 2px 0 rgba(0,0,0,0.5);
	font-size: 12px; //
}

si cambio el valor al font-size del .cover h2, .cover h3 no impacta en el texto, es como si no hubiera hecho ninguna modificación.

No se en que le estoy errando o si me esta tomando lo que le estoy aplicando a todo el sitio. No se que estoy haciendo mal.

Gracias
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil
Val: 6
Ha disminuido su posición en 7 puestos en HTML (en relación al último mes)
Gráfica de HTML

Estilos y tipografias

Publicado por Marlon (2 intervenciones) el 07/02/2020 21:32:32
tu error es que la linea la estas terminando con una coma
1
2
text-shadow: -1px -1px 1px rgba(0,0,0,0.2),
1px 1px 0 rgba(0,0,0,0.2),
cuando deberia terminar en punto y coma
1
2
text-shadow: -1px -1px 1px rgba(0,0,0,0.2);
1px 1px 0 rgba(0,0,0,0.2);

Saludos
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de Julio
Val: 43
Ha disminuido 1 puesto en HTML (en relación al último mes)
Gráfica de HTML

Estilos y tipografias

Publicado por Julio (11 intervenciones) el 07/02/2020 22:09:06
Hola.

Exacto, como te dice el compañero, tienes dos líneas terminando en coma. CSS no se "queja" de ello, simplemente que las siguientes propiedades no las va a tener en cuenta debido a ese error, entre ellas ese font-size que comentas.

-----------------------------
Aprende la programación desde una perspectiva básica y simplista en Programación Básica
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil
Val: 36
Ha mantenido su posición en HTML (en relación al último mes)
Gráfica de HTML

Estilos y tipografias

Publicado por Daniel (9 intervenciones) el 19/02/2020 12:10:07
Buenas a todos,

gracias a todos lo que me ayudaron. Pongo a continuación como hice para que me tome como prioridad un estilo en particular utilizado en varias paginas pero con distintos nombre. Utilice al final del parámetro que necesitaba la palabra !important.
A continuación unas de la parte del código:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
.cover h2
{
display: block;
width: 100%;
margin: 0% 0 8% 0%;
padding: 0;
text-align: center;
line-height: 1.2;
letter-spacing: 1px;
color: #fff;
font-size: 16px !important;
font-family: 'Nixie One';
}
 
.cover h3
{
display: block;
width: 50%;
text-align: center;
color: #fff;
font-size: 8px !important;
}

Espero que ayude a otros como me ayudo a mi sus comentarios.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar