HTML CSS JAVASCRIPT SQL PYTHON PHP HOW TO W3.CSS JAVA JQUERY C++ R React
ภาษาไทย Afrikaans العربية čeština Deutsch Español Français हिन्दी Bahasa Indonesia Italiano 日本語 한국어 မြန်မာဘာသာ Nederlands Polski Português Русский Türkçe Tiếng Việt

Esercitazione CSS

CSS CASA Introduzione CSS Sintassi CSS Selettori CSS CSS Come fare per Commenti CSS Colori CSS
Colori RGB ESADECIMALE HSL
Sfondi CSS
Colore di sfondo Immagine di sfondo Ripetizione dello sfondo Allegato di sfondo Stenografia di sfondo
Confini CSS
frontiere Larghezza del bordo Colore del bordo Lati di confine Stenografia di confine Bordi arrotondati
Margini CSS
margini Margine di collasso
Imbottitura CSS Altezza/larghezza CSS Modello a scatola CSS Schema CSS
Schema Larghezza contorno Colore contorno Schema abbreviato Spostamento contorno
Testo CSS
Colore del testo Allineamento del testo Decorazione del testo Trasformazione del testo Spaziatura del testo Ombra del testo
Font CSS
Famiglia di font Font Web sicuro Fonti di riserva Stile carattere Dimensione del font Font Google Abbinamenti di caratteri Stenografia dei caratteri
Icone CSS Collegamenti CSS Elenchi CSS Tabelle CSS
Bordi del tavolo Dimensioni della tavola Allineamento tavola Stile da tavola Tabella reattiva
Display CSS Larghezza massima CSS Posizione CSS Indice Z CSS Overflow CSS CSS galleggiante
Galleggiante Chiaro Esempi di galleggiamento
CSS Inline-block Allineamento CSS Combinatori CSS Pseudo-classe CSS Pseudoelemento CSS Opacità CSS Barra di navigazione CSS
barra di navigazione Barra di navigazione verticale Barra di navigazione orizzontale
Menu a discesa CSS Galleria di immagini CSS Sprite di immagini CSS Selettori CSS Attr Moduli CSS Contatori CSS Layout del sito Web CSS Unità CSS Specificità CSS CSS! importante Funzioni matematiche CSS

CSS avanzato

Angoli arrotondati CSS Immagini del bordo CSS Sfondi CSS Colori CSS Parole chiave a colori CSS Gradienti CSS
Gradienti lineari Radial Gradients Conic Gradients
Ombre CSS
Shadow Effects Box Shadow
Effetti di testo CSS Font Web CSS Trasformazioni 2D CSS Trasformazioni CSS 3D Transizioni CSS Animazioni CSS Suggerimenti CSS Immagini in stile CSS Riflessione dell'immagine CSS Adattamento agli oggetti CSS Posizione dell'oggetto CSS Mascheratura CSS Pulsanti CSS Impaginazione CSS Colonne multiple CSS Interfaccia utente CSS Variabili CSS
The var() Function Overriding Variables Variables and JavaScript Variables in Media Queries
Dimensioni della scatola CSS Query sui media CSS Esempi CSS MQ Cassetta flessibile CSS
CSS Flexbox CSS Flex Container CSS Flex Items CSS Flex Responsive

CSS reattivo

Introduzione a RWD Vista posteriore Vista griglia RWD Query sui media RWD Immagini RWD Video RWD Quadri RWD Modelli RWD

Griglia CSS

Introduzione alla griglia Contenitore a griglia Elemento griglia

CSS SASS

Esercitazione SASS

Esempi CSS

Modelli CSS Esempi CSS css quiz Esercizi CSS Certificato CSS

Riferimenti CSS

Riferimento CSS Selettori CSS Funzioni CSS CSS di riferimento sonoro Font sicuri per il Web CSS CSS Animabile Unità CSS Convertitore CSS PX-EM Colori CSS Valori di colore CSS Valori predefiniti CSS Supporto del browser CSS

Web design reattivo - Introduzione

❮ Precedente Prossimo ❯

Che cos'è il design web reattivo?

Il responsive web design rende la tua pagina web perfetta su tutti i dispositivi.

Il responsive web design utilizza solo HTML e CSS.

Il responsive web design non è un programma o un JavaScript.

Progettare per la migliore esperienza per tutti gli utenti

Le pagine Web possono essere visualizzate utilizzando molti dispositivi diversi: desktop, tablet e telefoni. La tua pagina web dovrebbe avere un bell'aspetto ed essere facile da usare, indipendentemente dal dispositivo.

Le pagine Web non dovrebbero omettere informazioni per adattarsi a dispositivi più piccoli, ma piuttosto adattarne il contenuto per adattarsi a qualsiasi dispositivo:



Desktop

Tavoletta

Telefono

Si chiama responsive web design quando usi CSS e HTML per ridimensionare, nascondere, ridurre, ingrandire o spostare il contenuto per farlo apparire bene su qualsiasi schermo.

Non preoccuparti se non capisci l'esempio seguente, analizzeremo il codice, passo dopo passo, nei prossimi capitoli:



❮ Precedente Prossimo ❯