Lộ trình tác vụ / từ đầu vào đến kết quả
Cách tạo một tam giác CSS
- 01
Chọn hướng
Trên phải / Dưới phải / Dưới trái / Trên trái · 8
- 02
Đặt kích thước
Chỉnh Chiều rộng đáy và Chiều cao tam giác từ 8 đến 180 px, mỗi bước 1 px. Với hướng Lên/Xuống, chiều rộng là đáy và chiều cao là khoảng cách tới đỉnh. Với Trái/Phải, chiều cao là đáy theo chiều dọc và chiều rộng là tầm vươn theo chiều ngang. Mặc định hình rộng 72 px và cao 64 px.
- 03
Chọn màu tô
Đặt Màu tô thành bất kỳ giá trị hex sáu chữ số nào — mặc định là #0f4cff. Bản xem trước trực tiếp và khai báo border-color được tạo luôn đồng bộ, nên thứ bạn thấy chính xác là thứ được sao chép.
- 04
Kiểm tra trạng thái xem trước
Bản xem trước trực tiếp render lại theo mọi thay đổi và huy hiệu trạng thái hiển thị CSS HỢP LỆ khi mọi giá trị đều nằm trong dải. Một giá trị ngoài dải sẽ chuyển nó thành KIỂM TRA GIÁ TRỊ và chặn sao chép lẫn tải xuống cho đến khi điều khiển được đánh dấu được sửa.
- 05
Thử thiết lập mẫu
Tải mẫu tạo tam giác chỉ sang phải với tầm vươn ngang 104 px, đáy dọc 86 px và màu tô #ffd11a. Đặt lại khôi phục giá trị mặc định.
- 06
Sao chép hoặc tải xuống CSS
Nhấn Sao chép CSS để chép quy tắc .triangle vào clipboard, hoặc Tải xuống .css để lưu thành toolars-triangle.css. Quy tắc đặt width và height về không và khai báo cả bốn đường viền, sẵn sàng dán vào bất kỳ stylesheet nào. HTML chứa CSS hiện tại và ví dụ hoạt động. Điều khiển gốc hỗ trợ bàn phím.