Difference between revisions of "SVG Element"
Jump to navigation
Jump to search
(18 intermediate revisions by 2 users not shown) | |||
Line 1: | Line 1: | ||
=SVG Content Embedded directly in HTML, no Role Assignment= | =SVG Content Embedded directly in HTML, no Role Assignment= | ||
− | == | + | ==Inline SVG with Simulated Text== |
<html> | <html> | ||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN" "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd"> | <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN" "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd"> | ||
Line 561: | Line 561: | ||
</svg> | </svg> | ||
</html> | </html> | ||
− | == | + | |
+ | ==Inline SVG with Embedded True Text== | ||
<html> | <html> | ||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN" "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd"> | <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN" "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd"> | ||
Line 617: | Line 618: | ||
</svg> | </svg> | ||
</html> | </html> | ||
− | == | + | |
+ | ==Inline SVG with True Text and an Explicit <Title> Element== | ||
<html> | <html> | ||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN" | <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN" | ||
Line 683: | Line 685: | ||
</svg> | </svg> | ||
</html> | </html> | ||
+ | |||
=SVG Content Embedded Directly in HTML, Role Assignment of "Img"= | =SVG Content Embedded Directly in HTML, Role Assignment of "Img"= | ||
− | == | + | ==Inline SVG with Simulated Text and Role="img"== |
<html> | <html> | ||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN" "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd"> | <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN" "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd"> | ||
Line 1,245: | Line 1,248: | ||
</svg> | </svg> | ||
</html> | </html> | ||
− | == | + | |
+ | ==Inline SVG with Embedded True Text and Role="img"== | ||
<html> | <html> | ||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN" "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd"> | <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN" "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd"> | ||
Line 1,301: | Line 1,305: | ||
</svg> | </svg> | ||
</html> | </html> | ||
− | == | + | |
+ | ==Inline SVG with True Text, Role="img" and an Explicit <Title> Element== | ||
<html> | <html> | ||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN" | <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN" | ||
Line 1,367: | Line 1,372: | ||
</svg> | </svg> | ||
</html> | </html> | ||
− | == | + | |
+ | ==Inline SVG with True Text, an Explicit <Title> Element, Role="img", and Aria-Label Assignment== | ||
<html> | <html> | ||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN" | <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN" | ||
Line 1,373: | Line 1,379: | ||
<svg xmlns="http://www.w3.org/2000/svg" | <svg xmlns="http://www.w3.org/2000/svg" | ||
width="500px" height="250px" | width="500px" height="250px" | ||
− | viewBox="0 0 1167 623" role="img" aria-label="Aria-Label Assignment on SVG Example> | + | viewBox="0 0 1167 623" role="img" aria-label="Aria-Label Assignment on SVG Example"> |
<title>SVG Example Title Element</title> | <title>SVG Example Title Element</title> | ||
<g> | <g> | ||
Line 1,433: | Line 1,439: | ||
</svg> | </svg> | ||
</html> | </html> | ||
+ | |||
=SVG Content Linked as IMG source, No Alt Text= | =SVG Content Linked as IMG source, No Alt Text= | ||
− | == | + | ==IMG Element, source SVG with Simulated Text== |
<html><img src="https://labs.ssbbartgroup.com/images/1/17/SVGFakeText.svg"></html> | <html><img src="https://labs.ssbbartgroup.com/images/1/17/SVGFakeText.svg"></html> | ||
− | == | + | |
+ | ==IMG Element, source SVG with Embedded True Text== | ||
+ | ''Section currently incomplete'' | ||
+ | <html><img src=""></html> | ||
+ | |||
+ | ==IMG Element, source SVG with Embedded True Text and Explicit <Title> Element== | ||
''Section currently incomplete'' | ''Section currently incomplete'' | ||
<html><img src=""></html> | <html><img src=""></html> | ||
=SVG Content Linked as IMG source, Alt Text= | =SVG Content Linked as IMG source, Alt Text= | ||
− | == | + | ==IMG Element, source SVG with Simulated Text== |
<html><img src="https://labs.ssbbartgroup.com/images/1/17/SVGFakeText.svg" alt="SVG Alternative Text"></html> | <html><img src="https://labs.ssbbartgroup.com/images/1/17/SVGFakeText.svg" alt="SVG Alternative Text"></html> | ||
− | == | + | |
+ | ==IMG Element, source SVG with Embedded True Text== | ||
+ | ''Section currently incomplete'' | ||
+ | <html><img src="" alt="SVG Alternative Text"></html> | ||
+ | |||
+ | ==IMG Element, source SVG with Embedded True Text and Explicit <Title> Element== | ||
''Section currently incomplete'' | ''Section currently incomplete'' | ||
<html><img src="" alt="SVG Alternative Text"></html> | <html><img src="" alt="SVG Alternative Text"></html> | ||
[[Category:Elements]] | [[Category:Elements]] |
Latest revision as of 17:42, 12 September 2017
Contents
SVG Content Embedded directly in HTML, no Role Assignment
Inline SVG with Simulated Text
Inline SVG with Embedded True Text
Inline SVG with True Text and an Explicit <Title> Element
SVG Content Embedded Directly in HTML, Role Assignment of "Img"
Inline SVG with Simulated Text and Role="img"
Inline SVG with Embedded True Text and Role="img"
Inline SVG with True Text, Role="img" and an Explicit <Title> Element
Inline SVG with True Text, an Explicit <Title> Element, Role="img", and Aria-Label Assignment
SVG Content Linked as IMG source, No Alt Text
IMG Element, source SVG with Simulated Text
IMG Element, source SVG with Embedded True Text
Section currently incomplete
IMG Element, source SVG with Embedded True Text and Explicit <Title> Element
Section currently incomplete
SVG Content Linked as IMG source, Alt Text
IMG Element, source SVG with Simulated Text
IMG Element, source SVG with Embedded True Text
Section currently incomplete
IMG Element, source SVG with Embedded True Text and Explicit <Title> Element
Section currently incomplete