-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathtemplate.html
192 lines (158 loc) · 7.06 KB
/
template.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
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
<!DOCTYPE html>
<!-- this is a template for creating new webpages -->
<!-- this template was created by Ben Dowdell -->
<html>
<head>
<title>AASPI | NEW_PAGE_NAME</title>
<!-- The meta tag describes the way the page's characters are encoded -->
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- The <link> tag is used to reference the CSS style sheet
which describes how the page is styled and designed.
This file contains settings for colors, fonts, etc. -->
<link rel="stylesheet" href="style.css" type="text/css" />
<!-- Drop down menus from suckerfish at htmldog.com -->
<script type="text/javascript">
sfHover = function() {
var sfEls = document.getElementById("navlist").getElementsByTagName("li");
for (var i=0; i<sfEls.length; i++) {
sfEls[i].onmouseover=function() {
this.className+=" sfhover";
}
sfEls[i].onmouseout=function() {
this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
}
}
}
if (window.attachEvent) window.attachEvent("onload", sfHover);
</script>
<!-- This javascript enables drop down menus when the mouse hovers over
the selection. This is used currently when the mouse hovers over the
"members" menu item -->
</head>
<body>
<div id="frame">
<div id="header">
<div>
<!-- the table below serves as the top banner -->
<table border="0" width="100%" cellspacing="0" cellpadding="5" summary="header">
<tr>
<td rowspan="2"><img src="images/aaspi.png" alt="AASPI" /></td>
<td class="header_text"><h1>AASPI @ ConocoPhillips School of Geology & Geophysics</h1></td>
<td rowspan="2"><img src="images/cpsgg.png" alt="CPSGG" /></td>
</tr>
<tr>
<td class="header_text"><h3>Attribute Assisted Seismic Processing & Interpretation | The University of Oklahoma</h3></td>
</tr>
</table>
</div>
</div>
<!-- This list serves as the site navigation on the left pane -->
<!-- If a new page is to be added to the site navigation menu, do so here using <li></li> tags -->
<div id="container">
<div class="nav" id="sitenav">
<ul id="navlist">
<li><a href="index.html">home</a></li>
<li><a href="about.html">about</a></li>
<li><a href="members.html">members</a>
<ul>
<li><a href="faculty.html">principal investigators</a></li>
<li><a href="students.html">students</a></li>
<li><a href="sponsors.html">sponsors</a></li>
</ul>
</li>
<li><a href="documentation.html">documentation</a></li>
<li><a href="research.html">research</a></li>
<li><a href="publications.html">publications</a></li>
<li><a href="resources.html">resources</a></li>
<li><a href="contact.html">contact</a></li>
<li><a href="upload">downloads</a></li>
<li><a href="template.html">new_page_name</a></li> <!-- This is where you would put a new navigation link -->
</ul>
</div>
<!-- This div container holds the main page content, and this is where your changes should go -->
<div class="cont" id="content">
<h2>NEW_PAGE_NAME</h2>
<!-- PUT THE BULK OF THE NEW PAGE HERE -->
<!-- This is a sample table -->
<table border="1" width="100%" cellspacing="0" cellpadding="0" summary="Template">
<col span="1" width="70%" />
<col span="1" width="30%" />
<tbody>
<tr>
<th colspan="2" class="pub_head">This is a table heading</th> <!-- class="pub_head" is a style used on the page publications.html -->
</tr>
<tr class="pub_descr"> <!-- class="pub_descr" is a style used on the page publications.html -->
<td>Big Column</td>
<td>Small Column</td>
</tr>
<tr class="pub_content"> <!-- class="pub_content" is a style used on the page publications.html -->
<td>This is a space where you can put stuff...</td>
<td>More can go here!</td>
</tr>
<tr> <!-- This row has no specific styling and will use the defaults for the page! -->
<td>Stuff goes here using the page's default style</td>
<td>Likewise!</td>
</tr>
</tbody> <!-- Be sure to close the table body -->
</table> <!-- And also close the table -->
<p>This is a sample paragraph using the paragraph tags. This will create a block of text until you close the tag.
Unless you specifically format it, the text will continue uninterrupted until you close the tag, only breaking for
endlines. This paragraph uses the page default of centered text justification. If you want to actually break lines,
<br /> you must do so <strong>explicitly using the break tag.</strong> Use the style.css sheet to adjust the way the
page is formatted</p>
<p class="section_content">Notice that the default is for the text to use a centered justification. Here I am
using the section_content class from the homepage which specifies that text should be left justified.</p>
<!-- the hr tag creates a horizontal rule (line) across the page -->
<hr />
<!-- An example of different headings -->
<h1>Heading 1</h1>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h5>Heading 5</h5>
<hr />
<!-- Lets examine ordered and unordered lists -->
<p class="section_content">Let's take a look at ordered and unordered lists!</p>
<!-- Ordered first -->
<ol>
<li>This is item number one</li>
<li>This is item number two</li>
<li>And so on and so forth</li>
<li>We create ordered lists using the ol tag</li>
</ol>
<!-- Unordered next -->
<ul>
<li>This is the first item</li>
<li>This is item number two</li>
<li>And so on and so forth</li>
<li>We create unordered lists using the ul tag</li>
<li>Unordred lists are good when you don't want numbers</li>
<li><ul>
<li>You can even have a list within a list!</li>
<li>You simply make a list element a list</li>
</ul></li>
</ul>
<p class="section_content">I use unordered lists to create the site navigation menu on the left hand side.</p>
<p class="section_content">I use the style.css sheet to remove the bulletpoints for my unordered list I used for the site navigation menu.</p>
<p class="section_content">This is an example of how to make hyperlinks. This one links to <a href="http://www.google.com">Google</a></p>
<!-- Putting the image below in this div using class="image" will eliminate the active background hover the image is moused over -->
<div class="image">
<p>And this one links to <a href="http://www.ou.edu" target="_blank"><img src="images/ou.png" alt="OU" /></a> and opens in a new tab</p>
</div>
</div>
</div>
<!-- these are external links at the bottom of the page -->
<div class="nav" id="extlinks">
<p><a href="http://www.ou.edu/mcee/geology.html">ConocoPhillips School of Geology & Geophysics</a> | <a href="http://www.ou.edu/mcee.html">Mewbourne College of Earth & Energy</a> | <a href="http://www.ou.edu/web.html">The University of Oklahoma</a></p>
</div>
<!-- this is contact and copyright info for AASPI, CPSGG, MCEE, and OU -->
<div id="footer">
<address>Suite 872, Sarkeys Energy Center, 100 E. Boyd St., Norman, OK 73019<br />
Date of last revision: 06 June, 2015<br />
© Copyright 2015 The Board of Regents of the University of Oklahoma | All
Rights Reserved<br /></address>
<img src="images/ou.png" alt="OU" />
</div>
</div>
</body>
</html>