CSS - Cual fuente es la que impera en CSS?

 
Vista:
Imágen de perfil de Kathyu
Val: 101
Bronce
Ha mantenido su posición en CSS (en relación al último mes)
Gráfica de CSS

Cual fuente es la que impera en CSS?

Publicado por Kathyu (30 intervenciones) el 07/07/2020 22:24:25
Tengo que modificar un Wordpress Theme, y el problema es que el font-family que este trae impera o daña ciertas cosas. Les explico con código

De esta forma la clase img-title se queda tal cual esta el theme
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
@font-face {
    // Esto es lo que yo agrego
    font-family: 'back-to-black';
    src: url('fonts/imago/Back to Black Demo.ttf');
 
    // Esto es lo que el tema trae en su style.css
    font-family: 'FontAwesome';
    src: url('../../bw/assets/fonts/font-awesome/fontawesome-webfont.eot?v=4.1.0');
    src: url('../../bw/assets/fonts/font-awesome/fontawesome-webfont.eot?#iefix&v=4.1.0') format('embedded-opentype'), url('../../bw/assets/fonts/font-awesome/fontawesome-webfont.woff?v=4.1.0') format('woff'), url('../../bw/assets/fonts/font-awesome/fontawesome-webfont.ttf?v=4.1.0') format('truetype'), url('../../bw/assets/fonts/font-awesome/fontawesome-webfont.svg?v=4.1.0#fontawesomeregular') format('svg');
    font-weight: normal;
    font-style: normal;
}
 
// Esto es lo que quiero cambiar
.img-title{
	font-family: back-to-black !important;
	text-transform: capitalize !important;
}

De esta forma la clase img-title SI cambia el font-family pero los iconos y todo lo de Font Awesome se daña.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
@font-face {
    // Esto es lo que el tema trae en su style.css
    font-family: 'FontAwesome';
    src: url('../../bw/assets/fonts/font-awesome/fontawesome-webfont.eot?v=4.1.0');
    src: url('../../bw/assets/fonts/font-awesome/fontawesome-webfont.eot?#iefix&v=4.1.0') format('embedded-opentype'), url('../../bw/assets/fonts/font-awesome/fontawesome-webfont.woff?v=4.1.0') format('woff'), url('../../bw/assets/fonts/font-awesome/fontawesome-webfont.ttf?v=4.1.0') format('truetype'), url('../../bw/assets/fonts/font-awesome/fontawesome-webfont.svg?v=4.1.0#fontawesomeregular') format('svg');
 
    // Esto es lo que yo agrego
    font-family: 'back-to-black';
    src: url('fonts/imago/Back to Black Demo.ttf');
 
    font-weight: normal;
    font-style: normal;
}
 
// Esto es lo que quiero cambiar
.img-title{
	font-family: back-to-black !important;
	text-transform: capitalize !important;
}

Según entiendo el orden de las cosas predomina en CSS, y en este caso aunque yo use !important en mi clase no importa, cosa que me parece bastante raro porque con !important casi que todo se puede lograr.

Alguna idea de como puedo hacer para tener y que funcione esta fuente (que el cliente quiere) dentro de mi Wordpress theme?
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
Imágen de perfil de Kathyu
Val: 101
Bronce
Ha mantenido su posición en CSS (en relación al último mes)
Gráfica de CSS

Cual fuente es la que impera en CSS?

Publicado por Kathyu (30 intervenciones) el 07/07/2020 23:20:44
No pasó mucho tiempo. Ya lo solventé.

Hice todo lo del nuevo estilo en el apartado CSS Adicional que trae wordpress en cada theme, ahí metí toda la lógica del font-face

1
2
3
4
5
6
7
8
@font-face {
	font-family: 'back-to-black';
    src: url('https://midominio.com/assets/fonts/Back to Black Demo.ttf');
}
.img-title{
	font-family: back-to-black !important;
	text-transform: capitalize !important;
}

Bueno, aclaro que logré lo que quería pero la duda del post inicial sigue, Cual fuente es la que impera en CSS?
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
1
Comentar