-
Notifications
You must be signed in to change notification settings - Fork 8
/
svg-boilerplate.html
43 lines (41 loc) · 1.81 KB
/
svg-boilerplate.html
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
38
39
40
41
42
43
<!DOCTYPE html>
<html xmlns='http://www.w3.org/1999/xhtml' xml:lang='en' lang='en'>
<head>
<meta http-equiv='Content-Type' content='text/html; charset=utf-8'/>
<title>SVG Boilerplate</title>
<!-- Modernizr is loaded first so that we can feature-detect -->
<script src="js/modernizr-1.5.min.js"></script>
</head>
<body>
<!--
XXX TODO
- minimise the code that isn't
- test on many browsers, multiple setups, that haven't been so far
-->
<!-- TO USE WITH HTML5BOILERPLATE, CUT FROM HERE -->
<!-- ✁ ✁ ✁ ✁ ✁ ✁ ✁ ✁ ✁ ✁ ✁ ✁ ✁ ✁ ✁ ✁ ✁ ✁ ✁ ✁ ✁ ✁ ✁ ✁ ✁ ✁ ✁ ✁ ✁ ✁ ✁ ✁ ✁ ✁ ✁ ✁ ✁ ✁ ✁ ✁ ✁ ✁ ✁ ✁ -->
<!--
••• Use this to inline SVG in your HTML •••
XXX TODO
- explain the values (a tutorial on berjon.com could do)
- explain the limitations on prefixes and self-closing tags
-->
<svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'
width='100%' height='100%' viewPort='0 0 1000 1000'>
<!-- put some content in here -->
<rect x='0' y='0' width='100' height='100' fill='red'></rect>
</svg>
<!--
••• Use this to embed external SVG •••
-->
<!--[if lt IE 9]>
<object src='path/to/your.svg' classid='image/svg+xml' width='750' height='300'></object>
<![endif]-->
<!--[if gte IE 9]>-->
<object data='path/to/your.svg' type='image/svg+xml' width='750' height='300'></object>
<!--<![endif]-->
<script src='js/shimvg.js'></script>
<!-- ✃ ✃ ✃ ✃ ✃ ✃ ✃ ✃ ✃ ✃ ✃ ✃ ✃ ✃ ✃ ✃ ✃ ✃ ✃ ✃ ✃ ✃ ✃ ✃ ✃ ✃ ✃ ✃ ✃ ✃ ✃ ✃ ✃ ✃ ✃ ✃ ✃ ✃ ✃ ✃ ✃ ✃ ✃ ✃ -->
<!-- ... TO HERE -->
</body>
</html>