From 074785cea106179cb3305637055ab0a009ca74f2 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:42:52 -0500 Subject: initial commit --- files/pt-pt/web/css/background-repeat/index.html | 138 +++++++++++++++++++++++ 1 file changed, 138 insertions(+) create mode 100644 files/pt-pt/web/css/background-repeat/index.html (limited to 'files/pt-pt/web/css/background-repeat') diff --git a/files/pt-pt/web/css/background-repeat/index.html b/files/pt-pt/web/css/background-repeat/index.html new file mode 100644 index 0000000000..582f6f86f8 --- /dev/null +++ b/files/pt-pt/web/css/background-repeat/index.html @@ -0,0 +1,138 @@ +--- +title: background-repeat +slug: Web/CSS/background-repeat +tags: + - Referencia_CSS +translation_of: Web/CSS/background-repeat +--- +

{{ CSSRef() }}

+ +

Resumo

+ +

background-repeat specifies whether the image is repeated (tiled), and how.

+ + + +

Sintaxe

+ +
background-repeat: repeat | repeat-x | repeat-y | no-repeat | inherit
+
+ +

Valores

+ +
+
repeat
+
A imagem é repetida vertical e horizontalmente.
+
repeat-x
+
A imagem é repetida somente horizontalmente.
+
repeat-y
+
A imagem é repetida somente verticalmente.
+
no-repeat
+
A imagem não é repetida: somente uma cópia da imagem é desenhada.
+
+ + +

Exemplos

+ +

HTML

+ +
<ol>
+    <li>no-repeat
+        <div class="one">&nbsp;</div>
+    </li>
+    <li>repeat
+        <div class="two">&nbsp;</div>
+    </li>
+    <li>repeat-x
+        <div class="three">&nbsp;</div>
+    </li>
+    <li>repeat-y
+        <div class="four">&nbsp;</div>
+    </li>
+    <li>repeat-x, repeat-y (multiple images)
+        <div class="five">&nbsp;</div>
+    </li>
+</ol>
+ +

CSS

+ +
/* Shared for all DIVS in example */
+li {margin-bottom: 12px;}
+div {
+    background-image: url(https://mdn.mozillademos.org/files/12005/starsolid.gif);
+    width: 144px;
+    height: 84px;
+}
+
+/* background repeat CSS */
+.one {
+    background-repeat: no-repeat;
+}
+.two {
+    background-repeat: repeat;
+}
+.three {
+    background-repeat: repeat-x;
+}
+.four {
+    background-repeat: repeat-y;
+}
+
+/* Multiple images */
+.five {
+    background-image:  url(https://mdn.mozillademos.org/files/12005/starsolid.gif),
+                       url(https://developer.cdn.mozilla.net/media/redesign/img/favicon32.png);
+    background-repeat: repeat-x,
+                       repeat-y;
+    height: 144px;
+}
+ +

Result

+ +

In this example, each list item is matched with a different value of background-repeat.

+ +

{{EmbedLiveSample('Exemplos', 240, 360)}}

+ +

Compatibilidade com navegadores

+ + + + + + + + + + + + + + + + + + + + + + + + +
NavegadorVersão mais antiga
Internet Explorer4
Firefox1
Netscape4
Opera3.5
+ +

Veja também

+ +

{{ Cssxref("background") }}, {{ Cssxref("background-attachment") }}, {{ Cssxref("background-color") }}, {{ Cssxref("background-image") }}, {{ Cssxref("background-position") }}, {{ Cssxref("background-repeat") }}

+ +

Categorias

+ +

Interwiki Language Links

+ +

{{ languages( { "en": "en/CSS/background-repeat", "fr": "fr/CSS/background-repeat", "pl": "pl/CSS/background-repeat" } ) }}

-- cgit v1.2.3-54-g00ecf