-
Notifications
You must be signed in to change notification settings - Fork 0
/
example.html
executable file
·78 lines (56 loc) · 2.84 KB
/
example.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
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
<!DOCTYPE html>
<html>
<head>
<title>Example HTML page</title>
</head>
<body>
<h1>An example of some html</h1>
<h2>Headings and paragraphs (this is an h2 heading)</h2>
<p>In HTML headings are marked with using heading tags such h1. There are six levels of heading supported. The biggest is h1 which is used for page titles. The smallest is h6. On most pages you probably won't see h4-6 used.</p>
<p>Paragraphs are separated using p tags. This automatically separates them into blocks, leaving a gap in between.</p>
<h2>Blank lines and void tags</h2>
<p>It is also possible to insert extra blank lines manually using the br tag. The br tag is a special type of tag (called a 'void tag'); you don't need a closing br tag, just un opening one.</p>
<br>
<h2>Comments</h2>
<p>You can write comments in your html code, which won't be displayed in the browser.</p>
<!--- This is a comment. It won't show up in the page, but you will be able to see it if you view the page source (be warned!) -->
<h2>Lists</h2>
<p>Html has two basic types of list:</p>
<ol>
<li>Ordered lists (<ol>) - displays a numbered list</li>
<li>Unordered lists (<ul>) - displays a list of bullet points</li>
</ol>
<p>Both have the same basic structure.</p>
<ul>
<li>An opening list tag</li>
<li>Many list items (<li>)</li>
<li>A closing list tags</li>
</ul>
<p>You don't often see lists in their basic form, but lists are heavily used in websites; dropdown menus are often cleverly styled lists.</p>
<h2>Links</h2>
<p>Links look like this: <a href="http://www.facebook.com">link to facebook</a>. You specify where you want the link to point by specifying the 'href' inside the <a> tag.</p>
<p>The href can also point to local files. For example, <a href="./example.html">this</a> is a link to this page you're reading at the moment. Notice that the protocol and host part of the URL has been replaced by a "."</p>
<h2>Images</h2>
<p>Images are a bit like links. You specify the location of the image with the 'src' property in the <img> tag. Note that img tags are like br tags: they don't come in pairs. The 'alt' property should be used to provide a description of the image in case it won't load or the user is partially sighted.</p>
<p>Images can be stored on the same host ... </p>
<img src="./duck.jpg" alt="A local image" width="200px">
<p>... or on another server entirely.</p>
<img src="http://jerrymahoney.files.wordpress.com/2012/06/kitten.jpg" alt="A picture of a cat." width="200px">
<h2>Tables</h2>
<p>Tables are used for holding data</p>
<table class='table'>
<tr>
<th>Name</th>
<th>Profession</th>
</tr>
<tr>
<td>Rosamund</td>
<td>Cheese Taster</td>
</tr>
<tr>
<td>Dave</td>
<td>Stamp collector</td>
</tr>
</table>
</body>
</html>