border-radius
definește prin valorile exprimate in pixeli cat de rotunjite vor fi colțurile unui element HTML sau unei imagini. Fiecare colț poate avea o alta valoare exprimată in pixeli diferită de un alt colț al aceluiași element. Prin urmare putem folosi pana la 4 valori diferite atribuite unui element HTML sau imagine.border-radius: 5px ;
border-radius: 5px 7px 12px 4px;
border-radius-left: 5px;
border-radius-right: 7px;
border-radius-top: 12px;
border-radius-bottom: 4px;
border-radius: 5px 7px 12px 4px;
-webkit-
pentru 4,0 , Firefox folosește prefixul -moz-
pentru versiunea 3.0, Safari folosește prefixul -webkit-
pentru versiunea 3.1, Opera 10.5 prefix -o-
div {
border: 2px solid #333333;
padding: 10px 40px;
background: #dddddd;
width: 300px;
border-radius:25px;
}
div
este definit de urmatoarele proprietăți CSS: dimensiunea in lungime este redată de valoarea in pixeli a proprietății width
, folosește o bordură de 2 pixeli, o bordură solidă de culoare gri-inchis definită de caloarea HEX #333333. Culoarea de fundal este gri deschis definită de HEX #dddddd. Bordura rotunjită este de 25 pixeli pentru toate cele 4 colțuri.