aboutsummaryrefslogtreecommitdiff
path: root/files/pt-pt/web/css/background-position
diff options
context:
space:
mode:
authorPeter Bengtsson <mail@peterbe.com>2020-12-08 14:42:52 -0500
committerPeter Bengtsson <mail@peterbe.com>2020-12-08 14:42:52 -0500
commit074785cea106179cb3305637055ab0a009ca74f2 (patch)
treee6ae371cccd642aa2b67f39752a2cdf1fd4eb040 /files/pt-pt/web/css/background-position
parentda78a9e329e272dedb2400b79a3bdeebff387d47 (diff)
downloadtranslated-content-074785cea106179cb3305637055ab0a009ca74f2.tar.gz
translated-content-074785cea106179cb3305637055ab0a009ca74f2.tar.bz2
translated-content-074785cea106179cb3305637055ab0a009ca74f2.zip
initial commit
Diffstat (limited to 'files/pt-pt/web/css/background-position')
-rw-r--r--files/pt-pt/web/css/background-position/index.html85
1 files changed, 85 insertions, 0 deletions
diff --git a/files/pt-pt/web/css/background-position/index.html b/files/pt-pt/web/css/background-position/index.html
new file mode 100644
index 0000000000..5445184e42
--- /dev/null
+++ b/files/pt-pt/web/css/background-position/index.html
@@ -0,0 +1,85 @@
+---
+title: background-position
+slug: Web/CSS/background-position
+tags:
+ - Referencia_CSS
+translation_of: Web/CSS/background-position
+---
+<p>
+{{ CSSRef() }}
+</p>
+<h3 id="Resumo" name="Resumo"> Resumo </h3>
+<p><code>background-position</code> configura a posição inicial de qualquer imagem de fundo que seja configurada.
+</p>
+<ul><li> Valor inicial: 0% 0%
+</li><li> Aplica-se a: todos os elementos
+</li><li> Herdado: não
+</li><li> Porcentagens: refere-se ao tamanho da própria caixa
+</li><li> Mídia: <a href="pt/CSS/Media/Visual">visual</a>
+</li><li> Valor computado: para &lt;length&gt; o valor absoluto, se não uma porcentagem
+</li></ul>
+<h3 id="Sintaxe" name="Sintaxe"> Sintaxe </h3>
+<pre class="eval">background-position: [ [ &lt;percentage&gt; | &lt;length&gt; | left | center | right ] [ &lt;percentage&gt; | &lt;length&gt; | top | center | bottom ]? ] | [ [ left | center | right ] || [ top | center | bottom ] ] | inherit
+</pre>
+<h3 id="Valores" name="Valores"> Valores </h3>
+<dl><dt> &lt;percentage&gt; &lt;percentage&gt;</dt><dd> Com um par de valores de '0% 0%', o canto superior esquerdo da imagem é alinhado com o canto superior esquerdo do enchimento da borda da caixa. Um par de valores de '100% 100%' coloca o canto inferior direito da imagem no canto inferior direito da área de enchimento. Com um par de valores de '14% 84%', o ponto de 14% na horizontal e 84% na vertical da imagem é colocado no ponto 14% na horizontal e 84% na vertical da área de enchimento.
+</dd><dt> &lt;length&gt; &lt;length&gt;</dt><dd> Com um par de valores de '2cm 1cm', o canto superior esquerdo da imagem é colocado 2cm para a direita e 1cm abaixo do canto superior esquerdo da área de enchimento.
+</dd><dt>top left e left top</dt><dd> O mesmo que '0% 0%'.
+</dd><dt>top, top center e center top</dt><dd> O mesmo que '50% 0%'.
+</dd><dt>right top e top right</dt><dd> O mesmo que '100% 0%'.
+</dd><dt>left, left center e center left</dt><dd> O mesmo que '0% 50%'.
+</dd><dt>center e center center</dt><dd> O mesmo que '50% 50%'.
+</dd><dt>right, right center e center right</dt><dd> O mesmo que '100% 50%'.
+</dd><dt>bottom left e left bottom</dt><dd> O mesmo que '0% 100%'.
+</dd><dt>bottom, bottom center e center bottom</dt><dd> O mesmo que '50% 100%'.
+</dd><dt>bottom right e right bottom</dt><dd> O mesmo que '100% 100%'.
+</dd></dl>
+<p>Se somente um valor é especificado, então ele configura a posição horizontal, com a posição vertical em 50%. Caso contrário, o primeiro valor especifica a posição horizontal. Combinações são permitidas de valores de palavras-chave, comprimento ou porcentagens, mas se palavras-chave forem misturadas com outros valores, <code>'left'</code> e <code>'right'</code> podem somente ser usados como o primeiro valor, e <code>'top'</code> e <code>'down'</code> podem somente ser usados como o segundo valor. Posições negativas são permitidas.
+</p>
+<h3 id="Exemplos" name="Exemplos"> Exemplos </h3>
+<pre>.exampleone {
+ background-image: url("logo.png");
+ background-position: top center;
+}
+
+.exampletwo {
+ background-image: url("logo.png");
+ background-position: 25% 75%;
+}
+
+.examplethree {
+ background-image: url("logo.png");
+ background-position: 2cm bottom;
+}
+
+.examplefour {
+ background-image: url("logo.png");
+ background-position: center 10%;
+}
+
+.examplefive {
+ background-image: url("logo.png");
+ background-position: 2cm 50%;
+}
+
+</pre>
+<p><span class="comment">== Notas ==</span>
+</p>
+<h3 id="Especifica.C3.A7.C3.B5es" name="Especifica.C3.A7.C3.B5es"> Especificações </h3>
+<ul><li> <a class="external" href="http://www.w3.org/TR/CSS1#background-position">CSS 1</a>
+</li><li> <a class="external" href="http://www.w3.org/TR/CSS21/colors.html#propdef-background-position">CSS 2.1</a>
+</li><li> <a class="external" href="http://www.w3.org/TR/2005/WD-css3-background-20050216/#background-position">CSS 3</a>
+</li></ul>
+<h3 id="Compatibilidade_com_navegadores" name="Compatibilidade_com_navegadores"> Compatibilidade com navegadores </h3>
+<table class="standard-table"> <tbody><tr> <th>Navegador</th> <th>Versão mais antiga</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="Veja_tamb.C3.A9m" name="Veja_tamb.C3.A9m"> Veja também </h3>
+<p>{{ Cssxref("background") }},
+{{ Cssxref("background-attachment") }},
+{{ Cssxref("background-color") }},
+{{ Cssxref("background-image") }},
+{{ Cssxref("background-position") }},
+{{ Cssxref("background-repeat") }}
+</p><p><span class="comment">Categorias</span>
+</p><p><span class="comment">Interwiki Language Links</span>
+</p>{{ languages( { "en": "en/CSS/background-position", "fr": "fr/CSS/background-position", "pl": "pl/CSS/background-position" } ) }}