Tutorial HTML e CSS per Principianti

Basi di HTML

Introduzione Linguaggio HTML Tag HTML Attributi Stili Struttura base della pagina Tag di base Paragrafi Intestazioni Testo in grassetto Testo in corsivo Liste non ordinate Liste ordinate Link Link interni Immagini Larghezza dell'immagine Altezza dell'immagine Impostare larghezza e altezza dell'immagine Tabelle Larghezza e altezza della tabella Celle di intestazione Pratico

Basi del CSS

Introduzione al CSS Come lavorare con il CSS Valori per il colore Colori qualsiasi Larghezza e altezza Allineamento del testo Allineamento del testo a destra Allineamento del testo al centro Allineamento del testo a sinistra Allineamento del testo contemporaneamente a destra e a sinistra Pratica sull'allineamento del testo Grassetto Corsivo Dimensione del carattere Famiglia del carattere Interlinea Valore line-height senza unità Proprietà abbreviata font Rientro prima riga del testo Effetti testo Sottolineatura del testo Sovralineatura del testo Barratura del testo Annullamento effetti per il testo Praticum

Selettori

Relazioni tra tag Ereditarietà delle proprietà Raggruppamento dei selettori Proprietà comuni Selettori dei discendenti Selettore di figlio diretto Selettore di classe Tag span Tag div Raggruppamento delle classi Tag con classe specificata Selettore dei discendenti e classi Combinazioni complesse di selettori di discendenti e classi Errore comune con il selettore di discendenti Elemento con più classi Selettore per id Selettore per id e classi Utilizzo dell'id Selettore per più classi Più selettori insieme Errore con più selettori Raggruppamento di selettori complessi Errore nel raggruppamento Esercitazione sulle combinazioni di selettori Priorità dei selettori Nota sul conflitto di proprietà Regole di specificità Priorità dei selettori di discendenti Selettore di fratello adiacente Selettore di fratello generale Selettore universale Selettori di attributi Stati dei link Sfumature della sequenza degli stati dei link Stati link e visited Utilizzo comune degli stati dei link Selettori complessi con i link Link con classe Selezione degli elementi finali Selezione per posizione Selezione dell'unico figlio Selezione degli elementi vuoti Selezione per posizione e tipo di elementi Negazione not

Decorazione

Colore di sfondo Basi dei bordi Bordo solido Bordo puntinato Bordo tratteggiato Bordo a rilievo Bordo doppio Proprietà abbreviata per il bordo Bordi per lati diversi Arrotondamento bordi del blocco Arrotondamento bordi dello sfondo Creare un cerchio Arrotondamento per angoli diversi Quattro valori Due valori Tre valori Arrotondamento in percentuale Creare un cerchio con arrotondamento in percentuale Immagine di sfondo Ripetizione immagine di sfondo Altre proprietà per lo sfondo Marcatori degli elenchi ul Marcatori quadrati per gli elenchi ul Marcatori degli elenchi ul a forma di cerchio Marcatori degli elenchi ul a forma di cerchio pieno Assenza di marcatori per gli elenchi ul Marcatori degli elenchi ol Numeri romani minuscoli per gli elenchi ol Numeri romani maiuscoli per gli elenchi ol Lettere latine minuscole per gli elenchi ol Lettere latine maiuscole per gli elenchi ol Lettere greche minuscole per gli elenchi ol Numeri con zero iniziale per gli elenchi ol

Modello a blocchi

Margine esterno margin Margini margin per lati diversi Valori multipli in margin Quattro valori in margin Due valori in margin Tre valori in margin Spaziatura interna padding Spaziature padding per lati diversi Valori multipli in padding Espansione degli elementi Influenza del bordo sull'espansione degli elementi Influenza congiunta di padding e bordo sull'espansione degli elementi Annullamento dell'espansione degli elementi Elementi a blocco Larghezza e altezza di un elemento a blocco Larghezza di un elemento a blocco Altezza di un elemento a blocco Altezza senza contenuto Elementi a blocco multipli affiancati Elementi in linea Larghezza e altezza di un elemento in linea Elementi in linea multipli affiancati Spaziature tra elementi in linea Definizione del modello a blocchi Proprietà display Elementi inline-block Larghezza e altezza di un elemento inline-block Larghezza di un elemento inline-block Altezza di un elemento inline-block Elementi inline-block multipli affiancati Allineamento degli elementi a blocco Allineamento di un elemento a blocco con margine sinistro Allineamento di un elemento a blocco con margine destro Allineamento degli elementi in linea Centratura degli elementi in linea Centratura di elementi in linea multipli Allineamento degli elementi in linea a destra Allineamento degli elementi inline-block Centratura degli elementi inline-block Allineamento degli elementi inline-block a destra Elementi flex Altezza del genitore degli elementi flex Larghezza del genitore degli elementi flex Genitore inline-block Spaziature padding del genitore Margini margin ai discendenti Allineamento degli elementi flex Allineamento degli elementi flex al centro Allineamento degli elementi flex lungo il genitore Allineamento degli elementi flex lungo il genitore con margini Allineamento degli elementi flex lungo il genitore con margini uniformi

Posizionamento

Assoluto Relativo Assoluto rispetto al genitore Assoluto rispetto all'assoluto Assoluto senza coordinate Centratura tramite absolute Valori negativi per absolute Posizionamento fisso Blocco a larghezza schermo intero Sovrapposizione degli elementi lungo l'asse Z Regolazione della sovrapposizione degli elementi lungo l'asse Z Sfumature dell'uso del valore negativo di z-index

Float

Introduzione alla proprietà float Proprietà float e tag Combinazione di float e margin Combinazione di float e padding Elementi fluttuanti sotto i tag Effetto dei float sul genitore Altezza del genitore dei float Testo nel genitore dei float Wrapping Clear del wrapping Div separato con clearfix Altezza del genitore e clearfix Proprietà float per i blocchi Proprietà float e diversi blocchi Proprietà float e genitore senza testo

Flex

Posizionamento in riga o colonna Posizionamento degli elementi flex in riga invertita Posizionamento degli elementi flex in colonna Inversione della colonna con elementi flex Asse principale e asse trasversale Allineamento sull'asse principale Allineamento sull'asse trasversale Valore center della proprietà align-items Centratura senza altezza dei blocchi Centratura con altezze diverse dei blocchi Valore stretch della proprietà align-items Pratica sull'allineamento degli assi Allineamento di un singolo elemento Ordine dei blocchi flex

Griglie

Introduzione alle griglie Tracce e linee Visualizzazione nel debugger del browser Colonne Unità fr Valori fr frazionari Pixel e fr Percentuali e fr Funzione repeat Valore auto Valore auto-fill Funzione minmax Valore auto-fit Righe Shorthand per righe e colonne Combinazione di righe Combinazione di colonne Combinazioni di unioni Sovrapposizione di colonne Spazio tra le colonne Spazio tra le righe Spazio tra colonne e righe Piastrellatura

Layout

Creazione del menu Layout di siti web a colonna singola semplici Schema di layout con wrapper multipli Blocchi strutturali del sito web Schema di layout a due colonne Schema di layout a tre colonne per siti web Tag speciali per gli elementi del layout del sito web Tag di layout principali Tag per le sezioni Pratica sui layout
↑
Italiano▼
AfrikaansAzərbaycanБългарскиবাংলাБеларускаяČeštinaDanskDeutschΕλληνικάEnglishEspañolEestiSuomiFrançaisहिन्दीMagyarՀայերենIndonesia日本語ქართულიҚазақ한국어КыргызчаLietuviųLatviešuМакедонскиMelayuမြန်မာNederlandsNorskPolskiPortuguêsRomânăРусскийසිංහලSlovenčinaSlovenščinaShqipСрпскиSrpskiSvenskaKiswahiliТоҷикӣไทยTürkmenTürkçeЎзбекOʻzbekTiếng Việt
Utilizziamo i cookie per il funzionamento del sito, l'analisi e la personalizzazione. I dati vengono elaborati in conformità con la Politica sulla privacy.
accetta tutto personalizza rifiuta