1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
|
---
title: background
slug: Web/CSS/background
translation_of: Web/CSS/background
---
<p><< <a href="/it/Guida_di_riferimento_ai_CSS" title="it/Guida_di_riferimento_ai_CSS">Guida di riferimento ai CSS</a></p>
<h3 id="Sommario" name="Sommario">Sommario</h3>
<p>La proprietà <code>background</code> è una scorciatoia per impostare in un'unica riga i valori di altre proprietà inerenti allo sfondo. <code>background</code> può quindi essere utilizzata per impostare una o più tra le seguenti proprietà: <code><a href="/it/CSS/background-attachment" title="it/CSS/background-attachment">background-attachment</a></code>, <code><a href="/it/CSS/background-color" title="it/CSS/background-color">background-color</a></code>, <code><a href="/it/CSS/background-image" title="it/CSS/background-image">background-image</a></code>, <code><a href="/it/CSS/background-position" title="it/CSS/background-position">background-position</a></code>, <code><a href="/it/CSS/background-repeat" title="it/CSS/background-repeat">background-repeat</a></code>.</p>
<ul>
<li>Valore iniziale: si vedano le singole proprietà</li>
<li>Si applica a: tutti gli elementi</li>
<li>Eredità: no</li>
<li>Valori percentuali: permessi per <code><a href="/it/CSS/background-position" title="it/CSS/background-position">background-position</a></code></li>
<li>Media: <code><a href="/it/CSS/Media/Visual" title="it/CSS/Media/Visual">visual</a></code></li>
<li>Valore calcolato: si vedano le singole proprietà</li>
</ul>
<h3 id="Sintassi" name="Sintassi">Sintassi</h3>
<pre class="eval">background: [<em>background-color</em> || <em>background-image</em> ||
<em>background-repeat</em> || <em>background-attachment</em> ||
<em>background-position</em>] | <em>inherit</em>]
</pre>
<h3 id="Valori" name="Valori">Valori</h3>
<dl>
<dt>background-color</dt>
<dd>si veda <code><a href="/it/CSS/background-color" title="it/CSS/background-color">background-color</a></code>.</dd>
<dt>background-image </dt>
<dd>si veda <code><a href="/it/CSS/background-image" title="it/CSS/background-image">background-image</a></code>.</dd>
<dt>background-repeat </dt>
<dd>si veda <code><a href="/it/CSS/background-repeat" title="it/CSS/background-repeat">background-repeat</a></code>.</dd>
<dt>background-attachment </dt>
<dd>si veda <code><a href="/it/CSS/background-attachment" title="it/CSS/background-attachment">background-attachment</a></code>.</dd>
<dt>background-position </dt>
<dd>si veda <code><a href="/it/CSS/background-position" title="it/CSS/background-position">background-position</a></code>.</dd>
</dl>
<h2 id="Esempi">Esempi</h2>
<h3 id="HTML">HTML</h3>
<pre class="brush: html"><p class="topbanner">
Starry sky<br/>
Twinkle twinkle<br/>
Starry sky
</p>
<p class="warning">Here is a paragraph<p></pre>
<h3 id="CSS">CSS</h3>
<pre class="brush:css' highlight:[2,6];">.warning {
background: red;
}
.topbanner {
background: url("https://mdn.mozillademos.org/files/11983/starsolid.gif") #00D repeat-y fixed;
}
</pre>
<h3 id="Result">Result</h3>
<p>{{EmbedLiveSample("Esempi")}}</p>
<h3 id="Note" name="Note">Note</h3>
<p>Data una dichiarazione valida, la proprietà <code>background</code> prima imposta le singole proprietà relative al background ai loro valori iniziali, poi assegna i valori esplicitamente indicati nella dichiarazione. Non occorre quindi definire un valore per ognuna delle singole proprietà, ma solo per quelle a cui si desidera assegnare un valore diverso da quello predefinito.</p>
<h3 id="Specifiche" name="Specifiche">Specifiche</h3>
<ul>
<li><a class="external" href="http://www.w3.org/TR/CSS1#background">CSS 1</a></li>
<li><a class="external" href="http://www.w3.org/TR/CSS21/colors.html#propdef-background">CSS 2.1</a></li>
<li><a class="external" href="http://www.w3.org/TR/2005/WD-css3-background-20050216/#the-background">CSS 3</a></li>
</ul>
<h3 id="Compatibilit.C3.A0_con_i_browser" name="Compatibilit.C3.A0_con_i_browser">Compatibilità con i browser</h3>
<table class="standard-table">
<tbody>
<tr>
<th>Browser</th>
<th>Versione minima</th>
</tr>
<tr>
<td>Internet Explorer</td>
<td>4</td>
</tr>
<tr>
<td>Firefox</td>
<td>1</td>
</tr>
<tr>
<td>Netscape</td>
<td>6</td>
</tr>
<tr>
<td>Opera</td>
<td>3.5</td>
</tr>
</tbody>
</table>
<h3 id="Si_veda_anche" name="Si_veda_anche">Si veda anche</h3>
<p><code><a href="/it/CSS/background-attachment" title="it/CSS/background-attachment">background-attachment</a></code>, <code><a href="/it/CSS/background-color" title="it/CSS/background-color">background-color</a></code>, <code><a href="/it/CSS/background-image" title="it/CSS/background-image">background-image</a></code>, <code><a href="/it/CSS/background-position" title="it/CSS/background-position">background-position</a></code>, <code><a href="/it/CSS/background-repeat" title="it/CSS/background-repeat">background-repeat</a></code></p>
<p><span class="comment">Interwiki Language Links</span></p>
<p> </p>
<p>{{ languages( { "de": "de/CSS/background", "en": "en/CSS/background", "es": "es/CSS/background", "fr": "fr/CSS/background", "ja": "ja/CSS/background", "ko": "ko/CSS/background", "pl": "pl/CSS/background", "zh-cn": "cn/CSS/background" } ) }}</p>
|
