Ho notato su alcuni siti che utilizzano un layout fluido, è possibile rimuovere elementi nella pagina e sostituire elementi quando la finestra viene ridotta a una dimensione più piccola, ovviamente per rendere più facile la visualizzazione dei contenuti.Layout fluido con CSS
La mia domanda è .. cosa css viene utilizzato per rendere questo accada (se si tratta di CSS, JavaScript forse ..)? cosa devo guardare per saperne di più su questa tecnica?
Grazie!
Il foglio di stile contiene regole diverse per quando lo schermo è largo meno di 800 px. Se si guarda il foglio di stile per la pagina on line 983 v'è una regola @media come segue:
@media screen and (max-width: 800px) {
/* Alternate rules here*/
}
Questa è una caratteristica CSS3 quindi credo che il sito non restyle come bene per i browser più vecchi. Dettagli di media query può essere visto http://www.w3.org/TR/css3-mediaqueries/#width
ottima risposta! grazie molto :) – Alex
Utilizza CSS Media Queries. Guardate la fine del file CSS:
Questo tipo di disegno è più comunemente noto come il disegno "reattivo", mentre "fluido" il design è di solito indicato come design che non è fisso larghezza.
È possibile utilizzare le query multimediali CSS per produrre disegni come questo.
Un articolo interessante di questa tecnica (che si chiama responsive design, come Jim ha sottolineato):
siti come ..? –
@David buon punto, aggiunto. – Alex