Guida CSS Tecniche essenziali

25 luglio 2011

Testo, immagini, layout, form, liste, tabelle: soluzioni pronte per l'uso e tecniche da adottare nei principali contesti d'uso dei CSS

Introduzione

  1. 1. Introduzione
    Presentazione della guida

Tecniche di base

  1. 2. Reset: controllare i valori di default del browser
    Il punto di inizio di ogni progetto basato sui CSS: eguagliare i...
  2. 3. Cos'è la specificità
    Impariamo la regola fondamentale che gestisce il funzionamento dei...
  3. 4. Calcolare la specificità
    Metodi pratici per calcolare quale regola prevale in un CSS
  4. 5. La keyword !important
    Un modo semplice per dare priorità ad una regola specifica del...
  5. 6. Classi e/o id
    Capire il funzionamento di due strutture portanti del linguaggio CSS
  6. 7. Cambiare il cursore del mouse
    Usare i CSS per modificare l'aspetto del cursore a seconda delle...
  7. 8. Nascondere elementi
    Due metodi per non visualizzare specifici elementi su una pagina HTML
  8. 9. Fogli di stile per la stampa
    Usare i CSS per adattare il testo della pagina alla carta stampata

Gestione del testo

  1. 10. Impostare la dimensione base del testo
    Regole e tecniche per definire una dimensione base consistente per il...
  2. 11. Gestire le famiglie di font
    Creare gruppi di font consistenti e adatti ad ogni sistema
  3. 12. Font personalizzati con @font-face
    Usare font anche non presenti sul PC dell'utente
  4. 13. Aggiungere ombra al testo
    Usare al meglio la proprietà text-shadow
  5. 14. Unità di misura per il testo
    Quale unità scegliere per assegnare una dimensione consistente al...
  6. 15. Indentare il testo
    Definire un rientro per un'intera porzione di testo o per la sola...
  7. 16. Personalizzare l'aspetto dei link
    Come applicare stili differenti ai link presenti in una pagina
  8. 17. Centrare il testo all'interno di un box
    Come centrare alla perfezione una porzione di testo sia...

Uso e gestione delle immagini

  1. 18. Sprites CSS
    Tecnica potente e utilissima per gestire animazioni e immagini di...
  2. 19. Image Replacement
    Sostituire contenuti testuali con immagini preservando un markup...
  3. 20. Testo intorno alle immagini
    Tre semplici soluzioni per gestire al meglio lo scorrimento del testo...
  4. 21. Aggiungere un bordo intorno alle immagini
    Migliorare la presentazione di immagini e foto grazie ad un semplice...
  5. 22. Rimuovere il bordo blu intorno alle immagini
    Una semplice regola per far scomparire il tradizionale bordo blu...
  6. 23. Inserire del testo su un'immagine
    Due tecniche per creare didascalie da abbinare come descrizione alle...

Layout

  1. 24. Bordi arrotondati con i CSS
    Come arrotondare i bordi di un elemento grazie ai CSS3, con...
  2. 25. Aggiungere un'ombra a un box con box-shadow
    Impariamo ad applicare un'ombreggiatura agli elementi HTML con questa...
  3. 26. Sticky footer, posizionare il footer in fondo alla pagina
    Risolvere semplicemente uno dei problemi più comuni nella...
  4. 27. Impostare larghezza e altezza (minima e massima) sugli elementi
    Sfruttare al meglio min-width, max-width, min-height e max-height...
  5. 28. Altezza 100% nei layout
    Come impostare un’altezza dinamica che si adatta al layout della...
  6. 29. Centrare orizzontalmente e verticalmente un div
    Tre tecniche per ottenere box perfettamente centrati in senso...
  7. 30. Contenere i float
    Due tecniche per impedire che gli elementi con il float escano fuori...
  8. 31. Visualizzare un elemento inline come blocco e viceversa
    Modificare i valori di default della proprietà display per adattare...
  9. 32. Menu fisso in fondo alla pagina
    Realizziamo una barra di menu che rimane sempre in fondo, anche...
  1. 33. Assegnare stili ad una tabella
    Le regole di base per formattare al meglio una tabella con i CSS
  2. 34. Evidenziare la riga di una tabella al passaggio del mouse
    Una tecnica molto semplice per migliorare l'usabilità delle tabelle
  3. 35. Visualizzare una tabella con il colore delle colonne alternato
    Una tecniche semplice per migliorare l'usabilità delle tabelle
  4. 36. Applicare stili ai form
    Usare i CSS per modificare l'aspetto e il layout dei moduli
  5. 37. Applicare stili a campi di input e textarea
    Formattare un form per renderlo più bello, usabile e in linea con il...
  6. 38. Applicare uno stile ai pulsanti dei form
    Personalizzare l'aspetto di input di tipo submit e button
  7. 39. Evidenziare il focus sui campi dei form
    Un comodissimo ausilio per rendere più usabili i nostri moduli
  8. 40. Un pulsante di submit con aspetto simile al testo
    Modificare l'aspetto dei pulsanti di invio dei form
  9. 41. Differenziare gli stili dei campi di input
    Semplici metodi per personalizzare al meglio i campi di input di un...
  10. 42. Visualizzare una lista in senso orizzontale
    Disporre gli item di una lista su un'unica riga
  11. 43. Rimuovere il margine sinistro da una lista
    Formattare una lista operando sul margine degli elementi che la...
  12. 44. Personalizzare l'aspetto dei marcatori di lista
    Sostituire il classico cerchietto pieno di un item di lista con altri...
  13. 45. Menu verticale statico con le liste
    Codificare una lista nell'HTML e trasformarla in un menu grazie ai CSS
  14. 46. Menu orizzontale statico con le liste
    Creare un semplice menu orizzontale sfruttando le liste non ordinate...
  15. 47. Link su un elemento blocco
    Come rendere cliccabili div, paragrafi ed elementi blocco contenenti...
  16. 48. Realizzare un pannello a tab
    Tutto il codice necessario per creare un pannello a schede con i soli...
  17. 49. Stili personalizzati per Internet Explorer con i commenti condizionali
    Come usare i commenti condizionali per IE così da cambiare stile per...
Se vuoi aggiornamenti su Guida CSS Tecniche essenziali inserisci la tua e-mail nel box qui sotto:
 
X
Se vuoi aggiornamenti su Guida CSS Tecniche essenziali

inserisci la tua e-mail nel box qui sotto:

Ho letto e acconsento l'informativa sulla privacy

Acconsento al trattamento di cui al punto 3 dell'informativa sulla privacy