Avrundade kanter på block i CSS
Nu ska vi lära oss att avrunda hörn
på ett block. För detta bör man använda
egenskapen border-radius, som tar
ett värde i pixlar.
Vad betyder det att vi angav en avrundning,
till exempel, på 10px? Det är radien på cirkeln
som kan inskrivas i denna avrundning. Om
du inte är bra på matte och du inte förstår
den senaste meningen - glöm den och
bara justera avrundningen med ögat. Med
visst erfarenhet är det inget problem (mätinstrument
för att mäta avrundningar finns inte,
åtminstone har jag inte hört talas om ett sådant).
Låt oss avrunda hörnen på ett block genom att ge det
en avrundning på 10px:
<div id="elem"></div>
#elem {
width: 300px;
height: 100px;
border: 1px solid red;
border-radius: 10px;
}
:
Upprepa sidan enligt följande exempel:
