Cách tạo: hình tròn trống

Học cách sử dụng CSS để tạo hình tròn trống.

Cách tạo hình tròn trống

Bước 1 - Thêm HTML:

<span class="dot"></span>
<span class="dot"></span>
<span class="dot"></span>
<span class="dot"></span>

Bước 2 - Thêm CSS:

Để tạo hình tròn, hãy sử dụng border-radius và đặt giá trị là 50%Sau đó, đặt thuộc tính height và width Sử dụng kết hợp thuộc tính và giá trị khớp:

.dot {
  height: 25px;
  width: 25px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
}

Thử trực tiếp