1. Casa
  2. CSS3 proprietà border-radius

Il miglior tutorial CSS3 proprietà border-radius Nel 2024, in questo tutorial puoi imparare Esempi,Supporto per il browser,Attributo definizioni e le istruzioni,grammatica,esempio 1,esempio 2,articoli correlati,

CSS3 proprietà border-radius

Esempi

Div elemento per aggiungere bordi arrotondati:

div
{
border:2px solid;
border-radius:25px;
}

Prova »

Supporto per il browser

I dati riportati nella tabella rappresentano il primo browser a supportare il numero di versione della proprietà.

Subito dopo la -webkit- digitale, -MS- o -moz- fa a sostegno del prefisso attribuiscono primo numero di versione del browser.

proprietà
border-immagine 4.0 -webkit- 9.0 4.0 -moz- 5.0 -webkit- 10.5 -o-

Attributo definizioni e le istruzioni

proprietà border-radius è una possibile specificare fino a quattro border - * - proprietà raggio della proprietà compositi

Nota: Questa proprietà consente di aggiungere elementi di bordi arrotondati!

predefinito: 0
ereditarietà: no
versione: CSS3
sintassi JavaScript: object object.style.borderRadius = "5px"

grammatica

border-radius:1-4 length|%/1-4 length|%;

Nota: L'ordine dei quattro valori di ogni raggio sono: in alto a sinistra, in alto a destra, in basso a destra, in basso a sinistra.Se si omette l'angolo in basso a sinistra, in alto a destra è la stessa. Se si omette l'angolo in basso a destra, in alto a sinistra è lo stesso. Se si omette in alto a destra, in alto a sinistra è lo stesso.

值 描述
length 定义弯道的形状。
% 使用%定义角落的形状。

esempio 1

border-radius: 2em;

è equivalente a:

border-top-left-radius: 2em;
border-top-right-radius: 2em;
border-bottom-right-radius: 2em;
border-bottom-left-radius: 2em;

esempio 2

border-radius: 2em 1em 4em / 0.5em 3em;

è equivalente a:

border-top-left-radius: 2em 0.5em;
border-top-right-radius: 1em 3em;
border-bottom-right-radius: 4em 0.5em;
border-bottom-left-radius: 1em 3em;

articoli correlati

CSS3 tutorial: Border CSS3

Tutorial caldi

Contattaci

CSS3 proprietà border-radius
10/30