Spiego un po va.
Questo:
Codice: Seleziona tutto
<meta name="viewport" content="width=device-width, initial-scale=1">
Questo è un META TAG è NON va toccato se vuoi che il forum o qualsiasi pagina web sia responsive
Questo invece
Codice: Seleziona tutto
media="all and (max-width: 700px), all and (max-device-width: 700px)"
che può essere trovato anche nel css così
Codice: Seleziona tutto
@media all and (max-width: 700px), all and (max-device-width: 700px) {
/* ... code ... */
}
E' una MEDIA QUERY che serve a definire i breackpoint che sono in sostanza quando applicare o meno i css che esso contiene. Ora visto che stanno a fare aggiornamenti e visto che alle porte inizia a fare capolino il CSS4 ma ce ne vo ancora, hanno eliminato alcuni attributi e
max-device-width è uno di questi.
all sta per ogni tipo di dispositivo e situazione. Ricordo che le media query non solo possono essere applicate alla dimensione del dispositivo, ma anche alla sua orientazione e alla fase di stampa ad esempio.
Se volessi applicare un css quando un ad esempio un cellulare è messo in orizzontale (in gergo detto landscape) piuttosto che in verticale (portrait) potrei fare una cosa del tipo
Codice: Seleziona tutto
@media only screen and (orientation: landscape) and (max-width: 640px) {
/* codice */
}
Oppure ad esemio puo rendere una pagina pronta per la stampa rimuovendo tutte le cose inutili e non buone per essere processato da una stampante.
Le possibilità sono praticamente illimitate. Tutto chiaro?
