Rotunjirea colțurilor blocului în CSS
Acum vom învăța să rotunjim colțurile
unui bloc. Pentru aceasta trebuie aplicată
proprietatea border-radius, care acceptă
o valoare în pixeli.
Ce înseamnă faptul că am specificat o rotunjire,
de exemplu, de 10px? Acesta este raza cercului
care poate fi înscris în această rotunjire. Dacă
nu vă descurcați cu matematica și nu ați înțeles
ultima propoziție - uitați-o și
pur și simplu ajustați rotunjirea cu ochiul. Cu
ceva experiență, acest lucru nu este o problemă (nu există
un instrument de măsură pentru măsurarea rotunjirilor,
cel puțin eu nu am auzit de așa ceva).
Să rotunjim colțurile unui bloc, dându-i
o rotunjire de 10px:
<div id="elem"></div>
#elem {
width: 300px;
height: 100px;
border: 1px solid red;
border-radius: 10px;
}
:
Repetați pagina după acest model: