Chạy ❯
Nhận trang web của
riêng
bạn
×
Thay đổi định hướng
Lưu mã
Thay đổi chủ đề, Tối/Sáng
Đi tới Không gian
<!DOCTYPE html> <html> <head> <STYLE_PLACEHOLDER_2/> </head> <body> <h1>Thuộc tính offset</h1> <div id="frameDiv"> <img src="img_fish.svg" alt ="fish"> <svg fill="none" đột quỵ="gray" đột quỵ-width="2" đột quỵ-dasharray="5,5"> <path d="M 50 80 C 150 -20 250 180 350 80 " /> </svg> </div> <p><mark><strong>Lưu ý: </strong> Vì ví dụ này sử dụng 'offset-anchor' nên hiện tại nó chỉ hoạt động với trình duyệt Firefox.</mark></ p> <p>Ở đây, thuộc tính viết tắt 'offset' được sử dụng để đặt các giá trị thuộc tính cho offset-path, offset-distance, offset-rotate và offset-anchor:</p> <ol> <li>Đường dẫn cho hoạt ảnh được thiết lập (offset-path)</li> <li>con cá bắt đầu di chuyển ở khoảng cách 150 pixel tính từ điểm bắt đầu của đường đi (offset-distance)</li> <li>con cá được xoay không đổi -90 độ (offset-rotate)</li> <li>con cá được kết nối với đường đi ở cuối đuôi của nó, ở phía bên trái của phần tử, 50% tính từ đỉnh (offset-neo)</li> </ol> </body> </html>