21/11/2024
21/11/2024
21/11/2024
Vũ Thuận ThiênHiểu về thuộc tính border-radius
Để tạo hình ảnh tròn, chúng ta sẽ sử dụng thuộc tính border-radius trong CSS. Thuộc tính này cho phép bạn làm tròn các góc của một phần tử. Khi đặt giá trị border-radius bằng một nửa chiều cao hoặc chiều rộng của hình ảnh, bạn sẽ có một hình tròn hoàn hảo.
Cách thực hiện
1. Thêm hình ảnh vào HTML:
HTML
<img src="anh_cua_ban.jpg" alt="Hình ảnh của bạn" class="hinh-tron">
Use code with caution.
2. Tạo class CSS để tạo hình tròn và căn giữa:
CSS
.hinh-tron {
width: 200px; /* Điều chỉnh kích thước theo ý muốn */
height: 200px;
border-radius: 50%;
margin: 0 auto; /* Căn giữa hình ảnh theo chiều ngang */
}
21/11/2024
Hiểu về thuộc tính border-radius
Để tạo hình ảnh tròn, chúng ta sẽ sử dụng thuộc tính border-radius trong CSS. Thuộc tính này cho phép bạn làm tròn các góc của một phần tử. Khi đặt giá trị border-radius bằng một nửa chiều cao hoặc chiều rộng của hình ảnh, bạn sẽ có một hình tròn hoàn hảo.
Cách thực hiện
1. Thêm hình ảnh vào HTML:
HTML
<img src="anh_cua_ban.jpg" alt="Hình ảnh của bạn" class="hinh-tron">
Use code with caution.
2. Tạo class CSS để tạo hình tròn và căn giữa:
CSS
.hinh-tron {
width: 200px; /* Điều chỉnh kích thước theo ý muốn */
height: 200px;
border-radius: 50%;
margin: 0 auto; /* Căn giữa hình ảnh theo chiều ngang */
}
Nếu bạn muốn hỏi bài tập
Các câu hỏi của bạn luôn được giải đáp dưới 10 phút
CÂU HỎI LIÊN QUAN
Top thành viên trả lời