Chuyển đến nội dung chính
忆云竹

Tạo góc bo tròn CSS

Chỉnh bốn góc đồng thời hoặc riêng lẻ, xem trước góc bo elip và xuất border-radius CSS.

Đơn vị
Góc elip
Xem trước
CSS

Xử lý ngay trong trình duyệt. Không tải lên hay lưu dữ liệu.

Giới thiệu công cụ

So sánh góc tròn và elip cho nút, thẻ hoặc huy hiệu.

Cách sử dụng

Chọn px hoặc %, rồi dùng thanh trượt hay nhập số để chỉnh bán kính các góc. Ban đầu bốn góc được liên kết; tắt liên kết để chỉnh riêng. Trong tùy chọn elip, bật bán kính dọc riêng để điều chỉnh độ cong ngang và dọc khác nhau.

Giá trị từ 0–500 px hoặc 0–100%. Phần xem trước và CSS được sao chép hay tải xuống dùng cùng các số. Tỷ lệ phần trăm phụ thuộc kích thước thật của phần tử. Đổi đơn vị làm thay đổi cách hiểu giá trị, không phải phép quy đổi giữ nguyên kích thước hiển thị.

Câu hỏi thường gặp

Dấu gạch chéo trong border-radius là gì?

Trước dấu là bán kính ngang, sau dấu là bán kính dọc. CSS thu nhỏ các bán kính chồng nhau theo tỷ lệ để vừa hộp.

Vì sao 50% tạo hình bầu dục thay vì hình tròn?

Bán kính phần trăm dùng chiều rộng và chiều cao riêng biệt. Với 50%, một khung chữ nhật thành hình elip; muốn có hình tròn thì rộng và cao phải bằng nhau. Dùng pixel khi cần bán kính góc cố định và kiểm tra CSS trên đúng kích thước phần tử thực tế.

Bình luận

0
để tham gia thảo luận.
Chưa có bình luận.
Chuỗi trả lời

Theo dõi toàn bộ cuộc trò chuyện theo thời gian; mỗi câu trả lời cho biết chính xác tin nhắn được phản hồi.