Membulatkan Sempadan Blok dalam CSS

Sekarang kita akan belajar membulatkan sudut pada blok. Untuk ini, gunakan sifat border-radius, yang menerima nilai dalam piksel.

Apa maksudnya kita menentukan pembulatan, contohnya, sebanyak 10px? Itu adalah jejari bulatan, yang boleh dimasukkan ke dalam pembulatan ini. Jika anda tidak mahir dalam matematik dan anda tidak faham ayat terakhir itu - lupakan sahaja dan cuba sesuaikan pembulatan secara kasar. Dengan pengalaman tertentu, ini bukan masalah (alat pengukur untuk mengukur pembulatan tidak wujud, sekurang-kurangnya saya tidak pernah mendengarnya).

Mari kita bulatkan sudut blok dengan menetapkan pembulatan sebanyak 10px:

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

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

Результат: