In HTML5, inline svg is the abbreviation of "Scalable Vector Graphics", which means scalable vector graphics, used to define vector-based graphics for the web; svg uses XML format to define graphics, and the image is enlarged Or change the size without loss of graphic quality.
The operating environment of this tutorial: Windows 10 system, HTML5 version, Dell G3 computer.
What is html5 inline svg
HTML5 supports inline SVG.
SVG stands for Scalable Vector Graphics
SVG is used to define vector-based graphics for the web
SVG uses XML format to define graphics
SVG images will not lose their graphic quality when enlarged or changed in size
SVG is a standard of the World Wide Web Consortium
Compared with other image formats (such as JPEG and GIF) , the advantages of using SVG are:
SVG images can be created and modified through a text editor
SVG images can be searched, indexed, Scripted or compressed
SVG is scalable
SVG images can be printed with high quality at any resolution
SVG can be enlarged without losing image quality
The example is as follows:
<html> <head> <meta charset="utf-8"> <title>123</title> </head> <body> <svg xmlns="http://www.w3.org/2000/svg" version="1.1" height="190"> <polygon points="100,10 40,180 190,60 10,60 160,180" style="fill:lime;stroke:purple;stroke-width:5;fill-rule:evenodd;"/> </svg> </body> </html>
Output result:
Recommended tutorial: "html video tutorial"
The above is the detailed content of What is html5 inline svg. For more information, please follow other related articles on the PHP Chinese website!
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
