From 95aca4b4d8fa62815d4bd412fff1a364f842814a Mon Sep 17 00:00:00 2001 From: Ryan Johnson Date: Thu, 29 Apr 2021 16:16:42 -0700 Subject: remove retired locales (#699) --- files/it/web/css/object-fit/index.html | 161 --------------------------------- 1 file changed, 161 deletions(-) delete mode 100644 files/it/web/css/object-fit/index.html (limited to 'files/it/web/css/object-fit') diff --git a/files/it/web/css/object-fit/index.html b/files/it/web/css/object-fit/index.html deleted file mode 100644 index 10aec7f358..0000000000 --- a/files/it/web/css/object-fit/index.html +++ /dev/null @@ -1,161 +0,0 @@ ---- -title: object-fit -slug: Web/CSS/object-fit -translation_of: Web/CSS/object-fit ---- -
{{CSSRef}}
- -

La proprietà CSS object-fit istruisce il browser su come deve ridimensionare il contenuto di un elemento incluso, come avviene per i tag {{HTMLElement("img")}} o {{HTMLElement("video")}}, per adattarlo al suo contenitore.

- -

Per modificare l'allineamento dell'elemento ridimensionato rispetto al suo contenitore puoi usare la proprietà {{cssxref("object-position")}}.

- -
{{EmbedInteractiveExample("pages/css/object-fit.html")}}
- - - -

Sintassi

- -

La proprietà object-fit viene specificata usando uno dei seguenti valori.

- -

Valori

- -
-
contain
-
L'elemento viene ridimensionato in relazione al suo contenitore preservando le proporzioni. Se le proporzioni dell'elemento e il suo contenitore non sono identici si avrà come risultato l'effetto "letterboxed".
-
cover
-
L'elemento viene ridimensionato in relazione al suo contenitore preservando le proporzioni. Se le proporzioni dell'elemento non corrispondono alle proporzioni del suo contenitore, l'oggetto verrà ritagliato per adattarsi.
-
fill
-
L'elemento viene ridimensionato per riempire completamente il suo contenitore. Se le proporzioni dell'elemento non corrispondono alle proporzioni del suo contenitore, l'oggetto verrà deformato per adattarsi.
-
none
-
L'elemento non viene ridimensionato.
-
scale-down
-
L'elemento viene ridimensionto come se none o contain fossero specificati, ma con la differenza che si ottiene sempre un oggetto più piccolo.
-
- -

Formal syntax

- -{{csssyntax}} - -

Esempi

- -

HTML

- -
<div>
-  <h2>object-fit: fill</h2>
-  <img src="https://mdn.mozillademos.org/files/6457/mdn_logo_only_color.png" alt="MDN Logo" class="fill"/>
-
-  <img src="https://mdn.mozillademos.org/files/6457/mdn_logo_only_color.png" alt="MDN Logo" class="fill narrow"/>
-
-  <h2>object-fit: contain</h2>
-  <img src="https://mdn.mozillademos.org/files/6457/mdn_logo_only_color.png" alt="MDN Logo" class="contain"/>
-
-  <img src="https://mdn.mozillademos.org/files/6457/mdn_logo_only_color.png" alt="MDN Logo" class="contain narrow"/>
-
-  <h2>object-fit: cover</h2>
-  <img src="https://mdn.mozillademos.org/files/6457/mdn_logo_only_color.png" alt="MDN Logo" class="cover"/>
-
-  <img src="https://mdn.mozillademos.org/files/6457/mdn_logo_only_color.png" alt="MDN Logo" class="cover narrow"/>
-
-  <h2>object-fit: none</h2>
-  <img src="https://mdn.mozillademos.org/files/6457/mdn_logo_only_color.png" alt="MDN Logo" class="none"/>
-
-  <img src="https://mdn.mozillademos.org/files/6457/mdn_logo_only_color.png" alt="MDN Logo" class="none narrow"/>
-
-  <h2>object-fit: scale-down</h2>
-  <img src="https://mdn.mozillademos.org/files/6457/mdn_logo_only_color.png" alt="MDN Logo" class="scale-down"/>
-
-  <img src="https://mdn.mozillademos.org/files/6457/mdn_logo_only_color.png" alt="MDN Logo" class="scale-down narrow"/>
-
-</div>
- -

CSS

- -
h2 {
-  font-family: Courier New, monospace;
-  font-size: 1em;
-  margin: 1em 0 0.3em;
-}
-
-div {
-  display: flex;
-  flex-direction: column;
-  flex-wrap: wrap;
-  align-items: flex-start;
-  height: 940px;
-}
-
-img {
-  width: 150px;
-  height: 100px;
-  border: 1px solid #000;
-}
-
-.narrow {
-  width: 100px;
-  height: 150px;
-  margin-top: 10px;
-}
-
-.fill {
-  object-fit: fill;
-}
-
-.contain {
-  object-fit: contain;
-}
-
-.cover {
-  object-fit: cover;
-}
-
-.none {
-  object-fit: none;
-}
-
-.scale-down {
-  object-fit: scale-down;
-}
-
- -

Risultato

- -

{{ EmbedLiveSample('Example', 500, 450) }}

- -

Specifiche

- - - - - - - - - - - - - - - - - - - - - -
SpecificaStatoCommento
{{SpecName('CSS4 Images', '#the-object-fit', 'object-fit')}}{{Spec2('CSS4 Images')}}
{{SpecName('CSS3 Images', '#the-object-fit', 'object-fit')}}{{Spec2('CSS3 Images')}}Initial definition
- -

{{cssinfo}}

- -

Compatibilità browser

- - - -

{{Compat("css.properties.object-fit")}}

- -

Guarda anche

- - -- cgit v1.2.3-54-g00ecf