Categories:
Cloud (204)
Entertainment (11)
Facebook (43)
General (50)
Life (31)
Programming (64)
Technology (398)
Testing (4)
Tools (488)
Twitter (5)
Wearable (26)
Web Design (44)
Collections:
Other Resources:
Use SVG Images in OBJECT Tags
How to Use SVG Images in HTML <object> Tags?
✍: FYIcenter.com
If you want to use SVG images in HTML <object> Tags, you can save SVG images in .svg files and include SVG image file names in the "data" attribute of <object> Tags. You also need to specify the type="image/svg+xml" attribute in <object> Tags.
You can follow this tutorial to test this.
1. Save the following SVG image in a file called, circle.svg:
<svg xmlns="http://www.w3.org/2000/svg"> <circle cx="50" cy="50" r="50"/> </svg>
2. Save the following HTML document in another file called, object.html:
<html><body> <p>Black <object data="circle.svg" type="image/svg+xml"></object> Circle... </p> </body></html>
When you open the above HTML file, object.html, in a Web browser, you see a black circle inserted inside a text line.
Similar to square.html in the previous tutorial, extra white spaces are padded below and after image. The the 100px x 100px circle occupied an area of 300px x 150px.
See next tutorial on how to remove padded space around the SVG image.
Also note that, an empty OBJECT tag should coded as <object ...></object>, not <object .../>.
⇒ Use SVG Images in EMBED Tags
⇐ Use IMG "width" and "height" to Crop SVG Images
2022-12-03, 321🔥, 0💬
Popular Posts:
What is TestReail? TestRail is a comprehensive web-based test case management software to efficientl...
How to view dynamic field codes in Microsoft Word? Each dynamic value is Microsoft Word is driven by...
Why I am getting the "run or save ChromeSetup.exe" pop up box when trying to install Google Chrome 3...
What is "OneNote Linked Notes Add-in" in Microsoft Word? Should I disable it? "OneNote Linked Notes ...
How to unzip a Word Document .docx file? According to Microsoft documentation, a .docx file is reall...