Generatore di bordi arrotondati CSS
Angolo superiore sinistro (px)：
Angolo superiore destro (px)：
Angolo inferiore destro (px)：
Angolo inferiore sinistro (px)：
Cosa è il Generatore di bordi arrotondati CSS?
Il Generatore di bordi arrotondati CSS fornisce uno strumento per generare valori di raggio dei bordi CSS, consentendo di inserire i valori per ciascuna delle quattro direzioni per visualizzare l'anteprima e generare il codice CSS.
Proprietà CSS3 border-radius
| Proprietà | Descrizione |
|---|---|
| border-radius | Definisce il raggio dei bordi dell'elemento. |
| border-top-left-radius | Definisce il raggio dell'angolo in alto a sinistra. |
| border-top-right-radius | Definisce il raggio dell'angolo in alto a destra. |
| border-bottom-right-radius | Definisce il raggio dell'angolo in basso a destra. |
| border-bottom-left-radius | Definisce il raggio dell'angolo in basso a sinistra. |
Il nostro strumento utilizza la prima forma, che è una sintassi abbreviata per le altre. Ad esempio:
border-radius: 10px 10px 10px 10px; Il primo valore viene applicato all'angolo in alto a sinistra, il secondo all'angolo in alto a destra, il terzo all'angolo in basso a destra e il quarto all'angolo in basso a sinistra.
Come usare il Generatore di bordi arrotondati CSS?
- Imposta i valori delle proprietà: sinistra in alto (px), destra in alto (px), destra in basso (px), sinistra in basso (px).
- Il codice generato e l'anteprima verranno visualizzati nella regione sinistra.
- Clicca sul pulsante "Copia" per copiare il codice del raggio del bordo CSS.