You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
62 lines
1.3 KiB
62 lines
1.3 KiB
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<link rel="stylesheet" href="/css/examples.css"/>
|
|
<style media="screen">
|
|
rect {
|
|
transition: height 2s ease-in-out;
|
|
}
|
|
</style>
|
|
<script>
|
|
// window.setTimeout(function(){
|
|
// document.querySelector('rect').setAttribute('height', '500');
|
|
// },1000);
|
|
</script>
|
|
</head>
|
|
<body>
|
|
<svg>
|
|
<!-- <line x1="0" y1="0" x2="100" y2="100" stroke="purple"/>
|
|
<rect x="50" y="20" width="150" height="150" fill="red" stroke="blue"/>
|
|
<ellipse cx="200" cy="80" rx="100" ry="50" fill="green"/>
|
|
<polyline points="20,20
|
|
40,25
|
|
60,40
|
|
80,120
|
|
120,140
|
|
200,180" stroke="red" fill="green"/>
|
|
<polygon points="200,10 250,190 160,210 0,10" fill="yellow" stroke="black" />
|
|
<g transform="translate(50,100) scale(2) rotate(45)">
|
|
<circle r="10" cx="-10" cy="0" fill="blue" stroke="red" stroke-width="5"/>
|
|
<text>This is text</text>
|
|
</g> -->
|
|
<path d="
|
|
M 20 40
|
|
l 20 20
|
|
l 10 0
|
|
Z" stroke="black" fill="none"/>
|
|
|
|
<path d="
|
|
M 100 100
|
|
q 25 50, 50 0
|
|
t 50 0
|
|
t 25 0
|
|
t 50 0
|
|
t 100 0
|
|
" stroke="black" fill="none"/>
|
|
|
|
<path d="
|
|
M 50 50
|
|
c
|
|
0 20
|
|
20 20
|
|
20 0
|
|
s
|
|
40 20
|
|
40 0
|
|
"
|
|
fill="none" stroke="black"/>
|
|
<!-- <rect x="100" y="100" width="100" height="100" fill="grey" stroke="black"/> -->
|
|
</svg>
|
|
</body>
|
|
</html>
|