A blokk szegélyeinek lekerekítése CSS-ben

Most megtanuljuk, hogyan kell lekerekíteni a blokk sarkait. Ehhez a border-radius tulajdonságot kell használni, amely pixelben vesz fel értéket.

Mit jelent az, ha például 10px lekerekítést adtunk meg? Ez annak a körnek a sugara, amely ebbe a lekerekítésbe írható. Ha nem boldogulsz a matematikával és nem érted az utolsó mondatot - felejtsd el, és csak szemre válaszd ki a lekerekítést. Egy kevés gyakorlattal ez nem probléma (mérőeszköz a lekerekítések mérésére nem létezik, legalábbis én nem hallottam ilyenről).

Kerekítsük lek a blokk sarkait, 10px lekerekítést beállítva:

<div id="elem"></div>

#elem {
	width: 300px;
	height: 100px;
	border: 1px solid red;
	border-radius: 10px;
}

Ismételd meg az oldalt a minta szerint: