Forum

Salut,
Mie nu imi functioneaza partea asta:

<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" media="only screen and (max-width: 480px)" href="css/stylemobile.css" />
<link rel="stylesheet" media="only screen and (min-width: 481px)" href="css/stylenou.css" />

in stylenou.css am pus:

Cod: Selectaţi tot

#spanu{
  font-size: 2.5em; 	
}

iar in stylemobile.css am pus:

Cod: Selectaţi tot

#spanu{
  font-size: 1em; 	
}

dar in smartphone afiseaza tot font-size: 2.5em;. Am un Android 4.4.2 cu rezolutia 854 x 480 (diagonala 4.5 Inch) iar aplicatia o deschid in browserul smartphone. Care sa fie cauza? Multumesc.

La css nu conteaza, sau nu recunoaste, tipul de device folosit; ci dimensiunea ferestrei. Ca sa vezi daca functioneaza, poti testa si pe un laptop, modificand lungimea ferestrei browser-ului.
Poti sa testezi acest style css, micsorand si marind lungimea ferestrei:

Cod: Selectaţi tot

<style>
@media screen and (max-width: 480px) {
  body {
    background-color: #00da01;
  }
}

@media screen and (min-width: 481px) {
  body {
    background-color: #bbddfe;
  }
}
</style>

Incearca sa modifici valorile, in loc de 480, sa setezi in jurul lui 400, 401; apoi micsorezi fereastra pe smartphone sa vezi daca are efect.

Forum

Setare CSS in functie de device folosit cu Viewport Media

Setare CSS in functie de device folosit cu Viewport Media

Setare CSS in functie de device folosit cu Viewport Media