Lez.19 - Corso Intermedio Css

BACKGROUND
La Proprietà background

Immagini di Sfondo la Proprietà background

La prorpietà background possiamo utilizzarla anche nella Notazione Semplificata, proprio per semplificare e velocizzare il nostro lavoro.

Quindi anziché ogni volta scrivere:
- background-color: cyan;
- background-image: url(percorso);
- background-repeat: no-repeat;
- background-attachment: fixed;
- background-position: center top;


Possiamo cavarcela semplicemente scrivendo:
background: cyan url(percorso) no-repeat fixed center top;

Il codice:
<!DOCTYPE html>
<html lang="it">                     
 <head>			    
  <title>Immagini di sfondo la proprietà background</title>
  <meta charset="utf-8">
  <style type="text/css">
	body {
	   /*tutto questo viene sostituito dalla 
             notazione semplificata scritta sotto*/
	   /*   
	   background-color: cyan;
	   background-image: url(percorso);
	   background-repeat: no-repeat;
	   background-attachment: fixed;
	   background-position: center top;
	   */
			
	   background: cyan url(percorso) no-repeat fixed center top;
	}
  </style>
 </head>
 <body>			    
 	<h1>Immagini di sfondo la proprietà background</h1>
	<div>
	  <p>Paragrago 1</p>
	  <p>Paragrago 2</p>
	  <p>Paragrago 3</p>
	  <p>Paragrago 4</p>
	  <p>Paragrago 5</p>
	  <p>Paragrago 6</p>
	  <p>Paragrago 7</p>
	  <p>Paragrago 8</p>
	  <p>Paragrago 9</p>
	  <p>Paragrago 10</p>
	  <p>Paragrago 11</p>
	  <p>Paragrago 12</p>
	  <p>Paragrago 13</p>
	  <p>Paragrago 14</p>
	  <p>Paragrago 15</p>
	  <p>Paragrago 16</p>
	  <p>Paragrago 17</p>
	  <p>Paragrago 18</p>
	  <p>Paragrago 19</p>
	  <p>Paragrago 20</p>
	</div>
	<p>Paragrago 21</p>
	<p>Paragrago 22</p>
	<p>Paragrago 23</p>
	<p>Paragrago 24</p>
	<p>Paragrago 25</p>
	<p>Paragrago 26</p>
	<p>Paragrago 27</p>
	<p>Paragrago 28</p>
	<p>Paragrago 29</p>
	<p>Paragrago 30</p>
	<p>Paragrago 31</p>
 </body>               
</html>