-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathfolio-v01.html
154 lines (154 loc) · 3.6 KB
/
folio-v01.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
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
<!DOCTYPE html>
<!--Fixed header code copied from: https://www.w3schools.com/howto/howto_js_sticky_header.asp
but JavaScript seemed problematic, so was abandoned.
If the user zooms, the header fixing is gone! -->
<!-- 26/6/21 Nev "fixed" header is very temperamental on Android mobile - Chrome v91.0.4472.101
it was broken by this 40 character email with the normal font:
Also broken by long web links - avoided with a short "display text" or small font.
Max recommended image size is 940 pixels. 950 does not break the fixed header, but is almost off the screen.
If fixed header is broken - delete sections 1 by 1 to find the problem -->
<html>
<head>
<meta charset="utf-8">
<title>Blackwattle Web template</title>
<link rel="icon" href="images/SSC_SmallLogo.png">
<link rel="stylesheet" href="main.css">
<style type="text/css">
body {
background-color: rgb(220,250,236); /*light green */
}
</style>
</head>
<body>
<div class="h2-BlueBG" id="A01"></div>
<div class="header" id="myHeader">
<a href="#A01">Top</a> - <a href="#A02">Anchor2</a> - <a href="#A03">Anchor3</a> - <a href="#A04">Anchor4</a> -
<a href="index.html">Home</a>
</div>
<br>
<br>
<br>
<br>
<p class="h1-18ptBold">
<img src="images/YourLogo-JPG.jpg" alt="Daggy example of a logo" title="Daggy logo" /><br>
</p>
<p class="h1-18ptBold">
My first page
</p>
<p class="h1-18ptBold">
This will start simple!!<br>
</p>
<div class="content">
<a href="index.html">Home</a>
<br>
<br>
<div class="h2-BlueBG">
1st heading - Tables, bullets & numbered lists
</div>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<div class="h1-18ptBold" id="A02"></div>
<a href="index.html">Home</a>
<br>
<br>
<br>
<div class="h2-BlueBG">
2nd heading - but anchor is 4 lines above
</div>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<div class="h1-18ptBold" id="A03"></div>
<a href="index.html">Home</a>
<br>
<br>
<br>
<div class="h2-BlueBG">
3rd heading - image optimisation
</div>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<div class="h1-18ptBold" id="A04"></div>
<a href="index.html">Home</a>
<br>
<br>
<br>
<div class="h2-BlueBG">
4th heading -
Website editors (authoring tools)
</div>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<a href="index.html">Home</a>
<br>
<br>
<div class="body-purple">
This is some purple text if you need it!!
<br>
</div>
<div class="h2-BlueBG">
End of page
- DELETE what you don't need
</div>
</div>
</body>
</html>