SVGໃນ HTML

ທ່ານສາມາດສະແດງ SVG ສະມາຊິກໃຫ້ເປັນສ່ວນສຳຫຼັບ HTML ການຄວາມລະອຽດ

ສະແດງ SVG ທັງໝົດໃນ HTML ການຄວາມລະອຽດ

SVG ຮູບແບບຄວາມລະອຽດຫຼັກ:

ຂ້ອຍບໍ່ສາມາດຖືກນຳໃຊ້ SVG ອິນແລຣມໃນບາດດັບບາດຂອງບາດດັບໄດ້

ນີ້ແມ່ນ HTML ການຂຽນ:

<!DOCTYPE html>
<html>
<body>
<h1>SVG ຄັ້ງທຳອິດຂອງຂ້ອຍ</h1>
<svg width="100" height="100">
  <circle cx="50" cy="50" r="40" stroke="green" stroke-width="4" fill="yellow" />
</svg>
</body>
</html>

ທີ່ຈະພະຍາຍາມຄັບຄວາມເຫຼືອງ

SVG ການອະທິບາຍວຽກ:

  • SVG ຮູບແບບແມ່ນເລີ່ມຈາກ <svg>
  • width ແລະ height ສະແສງຂອງ <svg> ສະແດງວົງຂອງຮູບແບບ SVG
  • <circle> ສະມາຊິກຂອງຮູບແບບສະແດງວົງ
  • cx ແລະ cy ສະແສງວົງຂອງ x ແລະ y ຂອງສູນວົງ. ຖ້າບໍ່ໄດ້ກະຕຸ້ມ cx ແລະ cy, ສູນວົງຈະໄດ້ກະຕຸ້ມໃຫ້ເປັນ (0, 0)
  • r ສະແສງວົງຂອງວົງ
  • stroke ແລະ stroke-width ສະແສງການສະແດງຂອງວົງຂອງຮູບຈຳລອງ. ພວກເຮົາຈະກະຕຸ້ມວົງຂອງບົດສະຫຼະໃຫ້ເປັນເລັກສີຂຽວຂອງວົງຂອງບົດສະຫຼະຈຳລອງ 4 ວັດ
  • fill ສະແສງສະພາບສີຂອງວົງຂອງບົດສະຫຼະ. ພວກເຮົາຈະກະຕຸ້ມສີຂອງບົດສະຫຼະໃຫ້ເປັນສີເຫຼືອງ
  • </svg> Tag Close SVG Image

Note: Since SVG is written in XML, all elements must be closed correctly!