basic-svg/rectangle.html at master · sourovroy/basic-svg · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
<!DOCTYPE html>
<html>
<head>
	<title>Scalable Vector Graphics</title>

	<link rel="stylesheet" href="style.css">
</head>
<body>

	<div class="container">

		<h1>SVG <code>rect</code></h1>
		<svg width="400" height="180">
			<rect x="50" y="20" rx="20" ry="20" width="150" height="150" stroke-width="5" fill="red" stroke="black" opacity="0.5" />
		</svg>

		<hr>

		<svg width="400" height="180">
			<rect x="50" y="20" width="150" height="150" fill="blue" stroke="pink" stroke-width="5" stroke-opacity="0.9" fill-opacity="0.1" />
		</svg>

		<hr>

		<svg width="400" height="180">
			<rect x="50" y="20" width="150" height="150" fill="blue" stroke="pink" stroke-width="5" stroke-opacity="0.9" />
		</svg>

		<hr>

		<svg width="400" height="180">
			<rect x="50" y="20" width="150" height="150" fill="blue" stroke="pink" stroke-width="5" fill-opacity="0.1" />
		</svg>
	</div> <!-- /.container -->

</body>
</html>