Meu código CSS:
@charset “UTF-8”
@import url(<a href="https://fonts.googleapis.com/css?family=Titillium+Web">https://fonts.googleapis.com/css?family=Titillium+Web</a>);
@font-face {
font-family: ‘FonteLogo’;
src: url("…/_fonts/bubblegum-sans-regular.otf");
}
header#cabecalho h1 {
font-family: ‘FonteLogo’, sans-serif;
font-size: 30pt;
color: #606060;
text-shadow: 1px 1px 1px rgba(0,0,0,.6);
padding: 0px;
margin-bottom: 0px;
}
header#cabecalho h2 {
font-family: ‘Titillium Web’, sans-serif;
font-size: 15pt;
color: #888888;
padding: 0px;
margin-top: 0px;
}
O probema é o seguinte, se eu não inserir o @import url(https://fonts.googleapis.com/css?family=Titillium+Web); meu H1 (isso mesmo o H1, mesmo esse comando ser para o H2) não muda a fonte que tenho em uma pasta da minha máquina.
Se eu inserir o @import url(https://fonts.googleapis.com/css?family=Titillium+Web); antes do @font-face {…}, meu @fonte-face funciona no H1 e o @import não funciona no H2.
Se eu inserir o @import url(https://fonts.googleapis.com/css?family=Titillium+Web); depois do @font-face {…}, só o @import no H2 funciona.
Achei muito estranho esse problema.