зеркало из https://github.com/mozilla/gecko-dev.git
57 строки
1.7 KiB
HTML
57 строки
1.7 KiB
HTML
<!DOCTYPE HTML>
|
|
<html lang="en">
|
|
<style>
|
|
rect,
|
|
text,
|
|
foreignObject,
|
|
circle,
|
|
ellipse,
|
|
image,
|
|
line,
|
|
path,
|
|
polygon,
|
|
polyline {
|
|
outline: 1px solid black;
|
|
}
|
|
|
|
</style>
|
|
<body>
|
|
<svg xmlns="http://www.w3.org/2000/svg" overflow="visible">
|
|
<g>
|
|
<rect width="100" height="100" style="fill: yellow"/>
|
|
<text x="0" y="140" font-family="Verdana" font-size="20">
|
|
Hello world
|
|
</text>
|
|
<foreignObject x="0" y="160" width="200" height="60">
|
|
<div xmlns="http://www.w3.org/1999/xhtml">
|
|
Here is a paragraph that requires word wrap
|
|
</div>
|
|
</foreignObject>
|
|
<circle cx="40" cy="275" r="40" style="fill: green"/>
|
|
<ellipse cx="70" cy="380" rx="70" ry="50" style="fill: yellow"/>
|
|
<image x="0" y="450" height="100" width="100"/>
|
|
<line x1="0" y1="580" x2="100" y2="580" style="stroke: red; stroke-width: 2"/>
|
|
<path d="M50 600 L10 650 L90 650 Z"/>
|
|
<polygon points="300,50 350,0 400,50" style="fill: lime"/>
|
|
<polyline points="300,80 350,70 400,80" style="fill: none; stroke: black;stroke-width: 3"/>
|
|
<g transform="translate(300, 70)" style="outline: 1px solid">
|
|
<circle cx="50" cy="50" r="20" style="fill: blue; outline: 0px"/>
|
|
</g>
|
|
<g transform="translate(300, 150)" style="outline: 1px solid">
|
|
<circle cx="50" cy="50" r="20" style="fill: green; outline: 0px"/>
|
|
<g>
|
|
<rect x="15" y="15" width="30" height="10" style="fill: blue"/>
|
|
</g>
|
|
</g>
|
|
<svg x="300" y="250">
|
|
<rect x="30" y="10" height="50" width="50" style="fill: red"/>
|
|
</svg>
|
|
<a xlink:href="#" id="link">
|
|
<text x="300" y="350" font-family="Verdana" font-size="20">
|
|
link
|
|
</text>
|
|
</a>
|
|
</g>
|
|
</svg>
|
|
</body>
|
|
</html> |