CSS3 consente di controllare in modo molto preciso lo sfondo degli elementi della pagina.
Tra le nuove proprietà introdotte troviamo background-clip che consente di specificare quale sarà l'area interessata dallo sfondo. I valori disponibili sono:
- border-box: lo sfondo verrà disegnato a partire dal bordo (il bordo sovrasta comunque lo sfondo)
- padding-box: lo sfondo verrà disegnato a partire dalla spaziatura interna dell'elemento
- content-box: lo sfondo verrà disegnato a partire dal contenuto
Lo stile presentato nell'esempio seguente mostra in modo evidente i diversi risultati che si possono ottenere utilizzando la proprietà background-clip:
div { color: #000; padding: 20px; border: 10px dotted #f00; background-color: yellow; } div.borderBox { background-clip: border-box; } div.paddingBox { background-clip: padding-box; } div.contentBox { background-clip: content-box; }
Le specifiche complete per gli sfondi e i bordi di CSS3 sono disponibili all'indirizzo http://www.w3.org/TR/css3-background/
Commenti
Per inserire un commento, devi avere un account.
Fai il login e torna a questa pagina, oppure registrati alla nostra community.
Approfondimenti
Creare un form con Bootstrap 5
Impostare l'hostname di un'immagine docker per rendere il container da altri container in Visual Studio
Aggiungere più autori in un commit di Git
Creare l'effetto floating label per gli input con Bootstrap 5
Impostare il claim desiderato per il nome utente in ASP.NET Core con Microsoft Identity
Continuous Deployment tramite GitOps
Le regole da seguire per effettuare la migrazione a Bootstrap 5
Ottimizzare il codice JavaScript con i Shorthand Patterns - prima parte
Taggare le query create con EF Core con informazioni di debug sul codice
Utilizzare le Promise in Javascript - seconda parte
Caricare automaticamente i dati delle relazioni in EF Core 6
Utilizzare il Service Bus Explorer integrato del portale Azure