English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
L'attributo position CSS specifica come posizionare un elemento.
La tabella sottostante fornisce la descrizione dell'uso e la cronologia delle versioni di questa proprietà, nonché la sintassi di utilizzo di questa proprietà nei script JavaScript.
| Valore predefinito: | static |
|---|---|
| Applicabile a: | Tutti gli elementi |
| Ereditarietà: | Nessuno |
| Animabile: | No.Si prega di consultare Proprietà di animazione. |
| Versione: | CSS 2、3 |
| Sintassi JavaScript: | oggetto.style.position="absolute" |
Suggerimento:Gli elementi al di fuori dell'elemento position sono chiamati posizionati. La loro posizione verticale nell'ambiente di sovrapposizione è determinata dall'attributo z-index.
La sintassi di questo attributo è la seguente:
position: static | relative | absolute | fixed | sticky | initial | inherit
Ecco un esempio di come utilizzare la proprietà position.
h1 {
position: absolute;
top: 100px;
left: 150px;
}Prova a vedere </>Attenzione: Per i tipi di media di stampa, questa casella viene visualizzata su ogni pagina e è fissa rispetto alla casella della pagina, anche se la pagina è vista attraverso un viewport (ad esempio, nel caso di 'Anteprima di stampa').
La tabella sottostante descrive i valori di questa proprietà.
| Valore | Descrizione |
|---|---|
| static | La casella di questo elemento è una casella normale, posizionata secondo il flusso normale. Per le caselle statiche:superiore,destro,inferiore,sinistro, ez-indexL'attributo viene ignorato. Questo è il valore predefinito. |
| relative | L'elemento è posizionato rispetto alla sua posizione normale (che si chiama posizione nel flusso normale). |
| absolute | L'elemento è posizionato rispetto al primo antenato non statico. |
| fixed | Questo elemento è fisso rispetto al viewport dello schermo e non si muove durante lo scorrimento. Durante la stampa, l'elemento viene stampato su ogni pagina. |
| sticky | La posizione di questo elemento è simile a una casella posizionata relativamente e viene 'incollata' al suo antenato più vicino con meccanismo di scorrimento. |
| initial | Imposta questa proprietà al suo valore predefinito. |
| inherit | Se specificato, l'elemento correlato adotta il valore della proprietà position dell'elemento genitore. |
Compatibilità dei browser per la proprietà position; i numeri nella tabella rappresentano la versione minima del browser che supporta questa proprietà; tutti i browser mainstream supportano questa proprietà.
|
Ecco come fare riferimento ai seguenti tutorial:Posizione CSS,Strato CSS.
Proprietà correlate:superiore,destro,inferiore,sinistro,z-index.