Resolução em tamanho de telas diferentes

[Derme 0]

Eu gostaria de saber como faço em css, para quando o tamanho de tela for menor, como de Smartfones, eu aumentar automaticamente o tamanho da fonte, sem precisar mexer em cada classe.

 

Tipo: aumentar todas as fontes em 20%

 

Tem como? fazer isso na própria folha de estilos sem precisar criar outra secundária?

Tem como criar uma condicional na própria css levando em conta o tamanho da tela?

[luiz14 16]

Para alterar em determinado tamanho de tela você utiliza o @media e para aumentar a fonte de todos os elementos de uma vez você pode usar o *. Por exemplo:

@media(max-width: 1000px){

*{
font-size: 22pt
}

} 

Nesse exemplo, se a tela for menor que 1000 pixels, a fonte de todos os elementos será 22, porém se você já modificou a font de um elemento com ou sem classe, não vai funcionar no elemento modificado, se for esse o caso, recomendo que você crie mais uma classe em todos os elementos necessários para fazer o que quer. Por exemplo:

<div class='sua-classe font'></div>

Na classe font você coloca o tamanho que deseja dependendo do tamanho da tela.