Hướng dẫn SVG

SVG được gọi là hình ảnh vector có thể mở rộng (Scalable Vector Graphics)

SVG định nghĩa là XML định dạng hình ảnh dựa trên vector

ví dụ trong mỗi chương

Bằng cách sử dụng trình chỉnh sửa "thử nghiệm trực tiếp" của chúng tôi, bạn có thể chỉnh sửa SVG, sau đó nhấp vào nút để xem kết quả.

Mô hình SVG

<html>
<body>
<h1>SVG đầu tiên của tôi</h1>
<svg width="100" height="100">
  <circle cx="50" cy="50" r="40" stroke="green" stroke-width="4" fill="yellow" />
</svg>
</body>
</html>

thử nghiệm trực tiếp

cần có kiến thức cơ bản

trước khi tiếp tục học, bạn nên có một số hiểu biết cơ bản về:

  • HTML
  • cơ bản XML

Nếu bạn muốn học nội dung này trước, hãy truy cập các hướng dẫn liên quan trên trang chủ của chúng tôi.

điều gì là SVG？

  • SVG được gọi là hình ảnh vector có thể mở rộng (Scalable Vector Graphics)
  • SVG để định nghĩa hình ảnh web dựa trên vector
  • SVG định nghĩa hình ảnh bằng định dạng XML
  • SVG mỗi yếu tố và mỗi thuộc tính trong tệp có thể được thiết lập动画
  • SVG là tiêu chuẩn khuyến nghị của W3C
  • SVG kết hợp với các tiêu chuẩn W3C khác, chẳng hạn như DOM và XSL

SVG là tiêu chuẩn khuyến nghị của W3C

SVG 1.0 trở thành tiêu chuẩn khuyến nghị của W3C vào ngày 4 tháng 9 năm 2001.

SVG 1.1 trở thành tiêu chuẩn khuyến nghị của W3C vào ngày 14 tháng 1 năm 2003.

SVG 1.1 (phiên bản thứ hai) trở thành tiêu chuẩn khuyến nghị của W3C vào ngày 16 tháng 8 năm 2011.

SVG ưu thế

so với các định dạng hình ảnh khác (như JPEG và GIF), sử dụng SVG ưu điểm của nó là:

  • SVG hình ảnh có thể được tạo và chỉnh sửa bằng bất kỳ trình chỉnh sửa văn bản nào
  • SVG hình ảnh có thể được tìm kiếm, chỉ mục, viết kịch bản và nén
  • SVG hình ảnh có thể mở rộng
  • SVG hình ảnh có thể in với chất lượng cao ở bất kỳ độ phân giải nào
  • SVG hình ảnh có thể phóng to
  • SVG hình ảnh khi phóng to hoặc thu nhỏ sẽ không mất đi bất kỳ chất lượng nào
  • SVG là một tiêu chuẩn mở
  • SVG tệp XML là loại XML

tạo SVG hình ảnh

SVG Hình ảnh có thể được tạo bằng bất kỳ trình chỉnh sửa văn bản nào, nhưng sử dụng các chương trình vẽ (ví dụ Inkscape）Tạo ảnh SVG thường dễ dàng hơn.