Để bo góc hoặc bo tròn một đối tượng trong CSS, bạn hãy xài thuộc tính border-radius và gán giá trị là px hoặc %.

– Border: Có nghĩa là viền.

– Radius: Có nghĩa là bán kính.

[css] .img{
border-radius: 4px;
}

.img:hover{
border-radius: 50%;
}
[/css]

Trong ví dụ trên:

– Mình đặt border-rdius ở thẻ img (hình ảnh) là 4px để cho nó bo góc một chút.

– Mình đặt tiếp border-radius ở thẻ img:hover (khi di chuột lên hình) là 50% để nó trở thành hình tròn.

Vậy là chúng ta sẽ được một hình bo tròn nhẹ ở góc và khi di chuột lên nó sẽ trở thành hình tròn.

Trần Thành
Follow me

Leave a Reply

Your email address will not be published. Required fields are marked *