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 di border-bottom-right-radius in CSS3

border-bottom-right-radius in CSS viene utilizzato per impostare lo stile arrotondato dell'angolo in basso a destra dell'elemento. Questo arrotondamento può essere circolare o ellittico, quando il valore è 0 diventa un angolo retto normale, sia che lo sfondo sia un'immagine o un colore, sarà influenzato da questa proprietà nella forma.

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

Valore predefinito:0
Applicabile a:Tutti gli elementi
Ereditarietà:Nessuno
Animabile:È.Si prega di riferimento Proprietà animate.
Versione: Nuova funzionalità CSS3
Sintassi JavaScript:object object.style.borderBottomRightRadius="8px"

Attenzione:border-bottom-right-radius farà arrotondare l'elemento di sfondo anche se non è definito il bordo o il suo valore è impostato su none.

Sintassi di utilizzo di border-bottom-right-radius

La sintassi di questa proprietà è la seguente:

border-bottom-right-radius: [ length | percentage ]1 o 2 valori | iniziale | eredito

Questo simbolo abbreviato può utilizzare un valore o due valori separati da uno spazio.

  • Il valore della lunghezza secondaria 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 una delle lunghezze è zero, l'angolo è quadrato, non arrotondato.

L'esempio seguente dimostra come utilizzare l'attributo border-bottom-right-radius.

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

Valore dell'attributo

La tabella sottostante descrive i valori di questa proprietà.

ValoreDescrizione
lengthIl valore dell'unità di lunghezza può essere px, pt, cm, em ecc., ma non possono essere 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 utilizzare valori negativi.
initialImposta questa proprietà al suo valore predefinito.
inheritSe specificato, l'elemento correlato utilizza il valore calcolato dell'attributo border-bottom-right-radius del suo elemento padre.

Compatibilità del browser

Compatibilità del browser per l'attributo border-bottom-right-radius, i numeri nella tabella sotto rappresentano la versione minima del browser che supporta l'attributo. Tutti i browser principali supportano questo attributo.

  • Firefox 4+

  • Google Chrome 4+

  • Internet Explorer 9+

  • Apple Safari 5+

  • Opera 10.5+

Attenzione: Internet Explorer 8 e versioni precedenti non supportano l'attributo border-bottom-right-radius. È supportato in IE9 e versioni successive.

Leggi di più

Vedere la guida:CSS Border,CSS3 Border.

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