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/z-index/index.html | 192 ------------------------------------ 1 file changed, 192 deletions(-) delete mode 100644 files/it/web/css/z-index/index.html (limited to 'files/it/web/css/z-index/index.html') diff --git a/files/it/web/css/z-index/index.html b/files/it/web/css/z-index/index.html deleted file mode 100644 index ce15d46e40..0000000000 --- a/files/it/web/css/z-index/index.html +++ /dev/null @@ -1,192 +0,0 @@ ---- -title: z-index -slug: Web/CSS/z-index -translation_of: Web/CSS/z-index ---- -
{{CSSRef}}
- -
La Proprietà CSS z-index specifica lo z-order di un elemento posizionato e dei suoi discendenti. Nel caso di elementi che si sovrappongono, quelli con un valore di z-order maggiore sono sovrapposti a quelli con un valore più basso.
- -
- -
/* Keyword value */
-z-index: auto;
-
-/* <integer> values */
-z-index: 0;
-z-index: 3;
-z-index: 289;
-z-index: -1; /* Negative values to lower the priority */
-
-/* Global values */
-z-index: inherit;
-z-index: initial;
-z-index: unset;
-
- -

Per una box posizionata (ovvero con valore qualsiasi di position che non sia static) la proprietà z-index indica;

- -
    -
  1.  Il livello di sovrapposizione della box nello stacking context corrente.
    2. -
  2.  Se la box stabilisce uno stacking context locale.
    3. -
- -
<div class="container">
-<div class="block position1 text-top">z-index: auto</div>
-<div class="block position2 text-top">z-index: auto</div>
-<div class="block position3 text-top">z-index: auto</div>
-</div>
-
-<div class="container">
-<div class="block position1 text-bottom" style="z-index:3">z-index: 3</div>
-<div class="block position2 text-bottom" style="z-index:2">z-index: 2</div>
-<div class="block position3 text-bottom" style="z-index:1">z-index: 1</div>
-</div>
- -
-
* {
-  box-sizing: border-box;
-}
-
-.container {
-  display: inline-block;
-  width: 250px;
-  position: relative;
-}
-
-.block {
-  width: 150px;
-  height: 75px;
-  position: absolute;
-  font-family: monospace;
-  background-color: #E5E8FC;
-  border: solid 5px #112382;
-}
-
-.text-top {
-  padding: 0.5em 0 5em .5em;
-}
-
-.text-bottom {
-  padding: 4em 0 1.5em .5em;
-}
-
-.position1 {
-  top: 0;
-  left: 0;
-}
-
-.position2 {
-  top: 30px;
-  left: 30px;
-}
-
-.position3 {
-  top: 60px;
-  left: 60px;
-}
-
- -

{{EmbedLiveSample("z-index", 1200, 160, "", "", "example-outcome-frame")}}

- -

L'esempio sopra mostra l'effetto di z-index. Sulla sinistra abbiamo disegnato tre boxes, facendole sovrapporre usando absolute positioning. Per default, gli elementi sono sovrapposti seguendo l'ordine dichiarato nel codice HTML. Sulla destra abbiamo lo stesso markup, ma a differenza dell'ordine di default usiamo lo z-index. 

- -

{{cssinfo}}

- -

Sintassi

- -

La proprieta z-index e' specificata anche con le chiavi auto o <integer>.

- -

Valori

- -
-
auto
-
La box non stabilisce una nuova stacking context locale. Il livello di sovrapposizione della box generata e' lo stesso del livello di sovrapposizione del suo genitore
-
<integer>
-
Questo {{cssxref("<integer>")}} e' il livello di sovrapposizione della box generata nel corrente stacking context. La box stabilisce anche una locale stacking context in cui il suo livello di sovrapposizione e' 0. Questo significa che gli z-indexes dei discendenti non sono confrontati con gli z-indexes degli elementi all'esterno di questo elemento.
-
- -

Formal syntax

- -{{csssyntax}} - -

Examples

- -

HTML

- -
<div class="dashed-box">Dashed box
-  <span class="gold-box">Gold box</span>
-  <span class="green-box">Green box</span>
-</div>
-
- -

CSS

- -
.dashed-box {
-  position: relative;
-  z-index: 1;
-  border: dashed;
-  height: 8em;
-  margin-bottom: 1em;
-  margin-top: 2em;
-}
-.gold-box {
-  position: absolute;
-  z-index: 3; /* put .gold-box above .green-box and .dashed-box */
-  background: gold;
-  width: 80%;
-  left: 60px;
-  top: 3em;
-}
-.green-box {
-  position: absolute;
-  z-index: 2; /* put .green-box above .dashed-box */
-  background: lightgreen;
-  width: 20%;
-  left: 65%;
-  top: -25px;
-  height: 7em;
-  opacity: 0.9;
-}
-
- -

Result

- -

{{ EmbedLiveSample('Examples', '550', '200', '') }}

- -

Specifications

- - - - - - - - - - - - - - - - - - - - - -
SpecificationStatusComment
{{SpecName('CSS3 Transitions', '#animatable-css', 'animation behavior for z-index')}}{{Spec2('CSS3 Transitions')}}Defines z-index as animatable.
{{SpecName('CSS2.1', 'visuren.html#z-index', 'z-index')}}{{Spec2('CSS2.1')}}Initial definition
- -

Browser compatibility

- - - -

{{Compat("css.properties.z-index")}}

- -

See also

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