Zaokrąglanie granic bloku w CSS
Teraz nauczymy się zaokrąglać rogi
bloku. W tym celu należy zastosować
właściwość border-radius, przyjmującą
wartość w pikselach.
Co oznacza, że określiliśmy zaokrąglenie,
na przykład, na 10px? To promień okręgu,
który można wpisać w to zaokrąglenie. Jeśli
masz problemy z matematyką i nie rozumiesz
ostatniego zdania - zapomnij o nim i
po prostu dobieraj zaokrąglenie na oko. Przy
pewnym doświadczeniu zrobienie tego nie stanowi problemu (narzędzia
pomiarowego do mierzenia zaokrągleń nie ma,
przynajmniej ja o takim nie słyszałem).
Zaokrąglmy rogi bloku, ustawiając mu
zaokrąglenie na 10px:
<div id="elem"></div>
#elem {
width: 300px;
height: 100px;
border: 1px solid red;
border-radius: 10px;
}
:
Powtórz stronę według podanego wzoru: