Angoli arrotondati solo su alcuni angoli in css

E 'possibile creare un angolo arrotondato usando css dove ottengo solo arrotondamenti su un angolo specifico piuttosto che su tutti gli angoli? Attualmente sto usando:Angoli arrotondati solo su alcuni angoli in css

-webkit-border-radius: 7px; 
    -moz-border-radius: 7px; 
    border-radius: 7px;

Ma non vedo alcun modo di specificare l'angolo in alto a sinistra o in qualche altro angolo. Voglio che gli altri angoli rimangano quadrati.

fonte

2013-08-15 AndroidDev

provare in questo modo, 'border-radius: 4px 0px 0px 0px;' Demo: http://jsbin.com/acumag/1/edit –

Duplicato di http://stackoverflow.com/questions/16036486/how-to-set-border-radius-of-some-corner-only-with-css –

Si può fare come

border-radius: 5px 10px 15px 20px; /* This is a short hand syntax */

La sintassi precedente funziona come un ventaglio, a partire da 5px e termina il 20px, appena aggiunto un diagramma di sotto, la freccia in là raffigura l'inizio del flusso di sintassi abbreviata .

enter image description here

Demo

Per specificare un raggio particolare, è possibile utilizzare proprietà come

border-top-left-radius: 10px;

che equivale a

border-radius: 10px 0 0 0;

fonte

2013-08-15 05:43:19

È possibile utilizzare: DEMO

border-radius-alto a sinistra
border-radius-alto a destra
border-radius-basso a sinistra
border-radius-basso a destra
```
border-radius: 5px 0 10px 0; 
```

Per ulteriori informazioni visitare il sito Web this.

fonte

2013-08-15 05:44:38 Brian

Provare a utilizzare questo: -

border-radius: <specific_value>px <specific_value>px <specific_value>px <specific_value>px

questi 4 valori rappresentano i diversi angoli in un modo in senso orario.

fonte

2013-08-15 05:45:10

.rounded-corners { 
    -moz-border-radius: 20px; 
    -webkit-border-radius: 20px;\ 
    border-radius: 20px; 
}

modifiche può essere fatto in questo modo,

-webkit-border-top-left-radius: 0px; 
    -webkit-border-top-right-radius: 0px; 
    -moz-border-radius-topleft: 0px; 
    -moz-border-radius-topright: 0px; 
    border-top-left-radius: 0px; 
    border-top-right-radius: 0px; 
    -webkit-border-bottom-left-radius: 0px; 
    -webkit-border-bottom-right-radius: 0px; 
    -moz-border-radius-bottomleft: 0px; 
    -moz-border-radius-bottomright: 0px; 
    border-bottom-left-radius: 0px; 
    border-bottom-right-radius: 0px;

fonte

2013-08-15 05:54:49

E 'molto semplice per creare un bordo arrotondato specificando un particolare angolo: -

Se u vuole per creare l'angolo in alto a sinistra arrotondati e tutti gli altri angoli dritti, quindi utilizzare questo codice invece di "border-radius" e dare il valore desiderato in pixel

border-top-left-radius: 10px; 
-moz-border-top-left-radius: 10px; 
-webkit-border-top-left-radius: 10px;

puoi farlo in un modo diverso anche: -

raggio-raggio: 10px 0px 0px 0px;

dove il primo in per l'angolo in alto a sinistra (10px), il secondo è per l'angolo in alto a destra (0px), il terzo è per l'angolo in basso a destra (0px) e il quarto è per l'angolo in basso a sinistra (0px).

da questo, solo in alto a sinistra saranno resi arrotondata e tutti gli altri angoli rimarrà lo stesso

fonte

2013-08-15 06:47:45 Hussain

Angoli arrotondati solo su alcuni angoli in css

risposta

Problemi correlati