<line>
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.
Phần tử SVG <line> là một hình dạng cơ bản của SVG dùng để tạo ra một đường thẳng nối hai điểm.
Ngữ cảnh sử dụng
| Categories | Basic shape element, Graphics element, Shape element |
|---|---|
| Permitted content | Any number of the following elements, in any order: Animation elements Descriptive elements |
Thuộc tính
x1-
Xác định tọa độ trục x của điểm bắt đầu của đường thẳng. Kiểu giá trị: <length> | <percentage> | <number>; Giá trị mặc định:
0; Có thể hoạt ảnh: có x2-
Xác định tọa độ trục x của điểm kết thúc của đường thẳng. Kiểu giá trị: <length> | <percentage> | <number>; Giá trị mặc định:
0; Có thể hoạt ảnh: có y1-
Xác định tọa độ trục y của điểm bắt đầu của đường thẳng. Kiểu giá trị: <length> | <percentage> | <number>; Giá trị mặc định:
0; Có thể hoạt ảnh: có y2-
Xác định tọa độ trục y của điểm kết thúc của đường thẳng. Kiểu giá trị: <length> | <percentage> | <number>; Giá trị mặc định:
0; Có thể hoạt ảnh: có pathLength-
Xác định tổng chiều dài đường dẫn theo đơn vị người dùng. Kiểu giá trị: <number>; Giá trị mặc định: không có; Có thể hoạt ảnh: có
Giao diện DOM
Phần tử này triển khai giao diện SVGLineElement.
Ví dụ
<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
<line x1="0" y1="80" x2="100" y2="20" stroke="black" />
<!-- Nếu bạn không chỉ định màu stroke
thì đường thẳng sẽ không hiển thị -->
</svg>
Thông số kỹ thuật
| Thông số kỹ thuật |
|---|
| Scalable Vector Graphics (SVG) 2 # LineElement |
Khả năng tương thích trình duyệt
Xem thêm
- Các hình dạng cơ bản SVG khác:
<circle>,<ellipse>,<polygon>,<polyline>,<rect>