initial commit

1 files changed, 138 insertions, 0 deletions

diff --git a/files/es/web/css/background/index.html b/files/es/web/css/background/index.html
new file mode 100644
index 0000000000..d982708096
--- /dev/null
+++ b/files/es/web/css/background/index.html
@@ -0,0 +1,138 @@
+---
+title: background
+slug: Web/CSS/background
+tags:
+  - CSS
+  - 'CSS:Referencias'
+  - Todas_las_Categorías
+translation_of: Web/CSS/background
+---
+<p>{{CSSRef}}</p>
+
+<p>La propiedad <code>background</code> es un atajo para definir los valores individuales del fondo en una única regla CSS. Se puede usar <code>background</code> para definir los valores de una o de todas las propiedades siguientes: {{ Cssxref("background-attachment") }}, {{ Cssxref("background-color", "color") }}, {{ Cssxref("background-image", "image") }}, {{ Cssxref("background-position", "position") }}, {{ Cssxref("background-repeat", "repeat") }}.</p>
+
+<ul>
+ <li>{{ Cssxref("initial", "Valor inicial") }}: ver propiedades individuales</li>
+ <li>Se aplica a: todos los elementos</li>
+ <li>{{ Cssxref("inheritance", "Herencia") }}: no</li>
+ <li>Porcentajes: permitido en {{ Cssxref("background-position", "posición") }}</li>
+ <li>Medio: {{ Cssxref("Media:Visual", "visual") }}</li>
+ <li>{{ Cssxref("computed value", "Valor calculada") }}: ver propiedades individuales</li>
+</ul>
+
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+
+<pre>/* Usando &lt;background-color&gt; */
+background: green;
+
+/* Usando &lt;bg-image&gt; y &lt;repeat-style&gt; */
+background: url("test.jpg") repeat-y;
+
+/* Usando &lt;box&gt; and &lt;background-color&gt; */
+background: border-box red;
+
+/* Una sola imagen, centrada y escalada */
+background: no-repeat center/80% url("../img/image.png");</pre>
+
+<p>La propiedad  <code>background</code> se especifica como una o más capas de fondo, separadas por comas.</p>
+
+<p>La sintaxis de cada capa es la siguiente:</p>
+
+<ul>
+ <li>Cada capa puede incluir cero o una ocurrencia de cualquiera de los siguientes valores
+  <ul>
+   <li><code><a href="https://wiki.developer.mozilla.org/es/docs/Web/CSS/background$edit#%3Cattachment%3E">&lt;attachment&gt;</a></code></li>
+   <li><code><a href="https://wiki.developer.mozilla.org/es/docs/Web/CSS/background$edit#%3Cbg-image%3E">&lt;bg-image&gt;</a></code></li>
+   <li><code><a href="https://wiki.developer.mozilla.org/es/docs/Web/CSS/background$edit#%3Cposition%3E">&lt;position&gt;</a></code></li>
+   <li><code><a href="https://wiki.developer.mozilla.org/es/docs/Web/CSS/background$edit#%3Cbg-size%3E">&lt;bg-size&gt;</a></code></li>
+   <li><code><a href="https://wiki.developer.mozilla.org/es/docs/Web/CSS/background$edit#%3Crepeat-style%3E">&lt;repeat-style&gt;</a></code></li>
+  </ul>
+ </li>
+ <li>El valor <code><a href="https://wiki.developer.mozilla.org/es/docs/Web/CSS/background$edit#%3Cbg-size%3E">&lt;bg-size&gt;</a></code> sólo puede ser incluido inmediatamente después de la <a href="https://wiki.developer.mozilla.org/es/docs/Web/CSS/background$edit#%3Cposition%3E">&lt;position&gt;</a>, separado con el carácter '/', así: "<code>center/80%</code>".</li>
+ <li>El valor <a href="https://wiki.developer.mozilla.org/es/docs/Web/CSS/background$edit#%3Cbox%3E">&lt;box&gt;</a> puede ser incluido cero, una o dos veces. Si se incluye una vez, establece ambos {{cssxref("background-origin")}} y {{cssxref("background-clip")}}. Si se incluye dos veces, la primera ocurrencia establece {{cssxref("background-origin")}}, y el segundo conjunto {{cssxref("background-clip")}}.</li>
+ <li>El valor <code><a href="https://wiki.developer.mozilla.org/es/docs/Web/CSS/background$edit#%3Cbackground-color%3E">&lt;background-color&gt;</a></code> sólo puede ser incluido en la última capa especificada.</li>
+</ul>
+
+<h2 id="Valores" name="Valores">Valores</h2>
+
+<dl>
+ <dt>background-color</dt>
+ <dd>ver <code><a href="/es/CSS/background-color" title="es/CSS/background-color">color</a></code>.</dd>
+ <dt>background-image </dt>
+ <dd>ver <code><a href="/es/CSS/background-image" title="es/CSS/background-image">image</a></code>.</dd>
+ <dt>background-repeat </dt>
+ <dd>ver <code><a href="/es/CSS/background-repeat" title="es/CSS/background-repeat">repeat</a></code>.</dd>
+ <dt>background-attachment </dt>
+ <dd>ver <code><a href="/es/CSS/background-attachment" title="es/CSS/background-attachment">background-attachment</a></code>.</dd>
+ <dt>background-position </dt>
+ <dd>ver <code><a href="/es/CSS/background-position" title="es/CSS/background-position">position</a></code>.</dd>
+</dl>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="HTML">HTML</h3>
+
+<pre class="brush: html">&lt;p class="topbanner"&gt;
+  Starry sky&lt;br/&gt;
+  Twinkle twinkle&lt;br/&gt;
+  Starry sky
+&lt;/p&gt;
+&lt;p class="warning"&gt;Here is a paragraph&lt;p&gt;</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("Ejemplos")}}</p>
+
+<h2 id="Notas" name="Notas">Notas</h2>
+
+<p>Tomando una declaración válida, la propiedad <code>background</code> inicia las propiedades individuales a sus valores iniciales para después asignarles los valores especificadas explícitamente en la declaración. No hay que definir un valor por cada propiedad individual, se cambia solo las que necesitamos en relación al valor por defecto.</p>
+
+<h2 id="Especificaciones" name="Especificaciones">Especificaciones</h2>
+
+<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>
+
+<h2 id="Compatibilidad_de_navegadores" name="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th>Navegador</th>
+   <th>Mínima versión</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>
+
+<h2 id="Ver_tambi.C3.A9n" name="Ver_tambi.C3.A9n">Ver también</h2>
+
+<p>{{ Cssxref("background") }}, {{ Cssxref("background-attachment") }}, {{ Cssxref("background-color") }}, {{ Cssxref("background-image") }}, {{ Cssxref("background-position") }}, {{ Cssxref("background-repeat") }}</p>