Home » BACKGROUND Lezione HTML/CSS (7)

BACKGROUND Lezione HTML/CSS (7)

  • stefano 

Background

 h1{ 
 background: purple;
 }

 body{       
 background: purple;     
 }
 
 body{ 
 background: url(zavagliando.jpg)

“body” si riferisce allo sfondo della pagina web.

Quando inserisci un’immagine nell’ “url“, se è di un formato troppo piccolo allora verrà ripetuta più volte per creare lo sfondo della pagina.  Per ovviare a questo problema si può fare così:

 body{ 
    background: url(zavagliando.jpg)
    background-repeat: no-repeat;
 }

Si utilizza “no-repeat” per non fare ripetere l’immagine 

 Body{ 
 background: url(zavaglio.jpg)
 background-size: cover;
 }
Si utilizza
"cover"
per far coprire all’immagine tutta la pagina (sfondo),

In pratica “cover” effettua un ingrandimento dell’immagine per tutta la larghezza della pagina, però se quest’ultima è molto lunga l’immagine potrebbe comunque ripetersi, se sempre prima non si è inserito il comando “no-repeat“.

Border

Border come suggerisce la parola indica le caratteristiche dei bordi di caselle immagini o altri blocchi che approfondiremo in seguito.

 1° metodo
 border-color: black; 
 border-width: 2px;
 border-style: dotted;  
 2° metodo (migliore)
 
border: 3px solid black;  

link utili: W3Schools

Skill
Tags: