English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية

Manuale di riferimento CSS

Regole CSS (RULES)

Manuale completo delle proprietà CSS

Metodo di utilizzo e esempio dell'attributo border-top-right-radius CSS3

L'attributo border-top-right-radius CSS imposta la forma arrotondata dell'angolo in alto a destra dell'elemento bordo.

La tabella sottostante fornisce una descrizione dell'uso di questa proprietà, la cronologia delle versioni e la sintassi di utilizzo in script JavaScript.

Valore predefinito:0
Applicabile a:Tutti gli elementi
Ereditarietà:Nessuno
Animabile:Sì.Rif.: Proprietà animazione.
Versione: Nuova funzionalità CSS3
Sintassi JavaScript:object object.style.borderTopRightRadius="5px"

Attenzione:border-top-right-radius anche se non definito o impostato a none, questa proprietà rende l'elemento con sfondo arrotondato.

Sintassi dell'uso di border-top-right-radius

La sintassi di questa proprietà è la seguente:

border-top-right-radius: [ length | percentage ]1 or 2 values | initial | inherit

Questo sintassismo può accettare un valore o due valori separati da uno spazio.

  • Il valore secondario opzionale definisce il raggio verticale dell'angolo in alto a destra, quindi la forma dell'angolo è un quarto di ellisse.

  • Se si omette la seconda lunghezza o se è uguale alla seconda lunghezza, la forma dell'angolo è un quarto di cerchio. Se uno dei due valori è zero, l'angolo è quadrato piuttosto che arrotondato.

I seguenti esempi illustrano come utilizzare la proprietà border-top-right-radius.

  div {
   border: 2px solid #f08080;
   border-top-right-radius: 20px;
  }
Prova a vedere‹/›

Valore dell'attributo

La tabella sottostante descrive i valori di questa proprietà.

ValoreDescrizione
lengthIn valori di lunghezza come px, pt, cm, em, ma non è permesso l'uso di valori negativi.
percentageLa dimensione del raggio, espressa in percentuale. In due valori, il primo valore è calcolato come percentuale della larghezza della scatola dell'elemento (cioè, il raggio orizzontale), mentre il secondo valore è calcolato come percentuale dell'altezza della scatola dell'elemento (cioè, il raggio verticale). Non è permesso l'uso di valori negativi.
initialImposta questa proprietà al suo valore predefinito.
inheritSe specificato, l'elemento correlato adotta il valore della proprietà border-top-right-radius del suo elemento padre.

Compatibilità del browser

Compatibilità dei browser per la proprietà border-top-right-radius; i numeri nella tabella rappresentano la versione minima del browser che supporta questa proprietà; tutti i browser principali supportano questa proprietà.

  • Firefox 4+

  • Google Chrome4+

  • Internet Explorer 9+

  • Apple Safari 5+

  • Opera 10.5+

Leggi di più

Vedi le lezioni:CSS Border,CSS3 Border.

Proprietà correlate:border-radius,border-bottom-left-radius,border-bottom-right-radius,border-top-left-radius.