Skip to content
Snippets Groups Projects
Commit 89ec063e authored by Andrej Rasevic's avatar Andrej Rasevic
Browse files

adding lecture code examples

parent bb2ddb72
No related branches found
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
Showing
with 1060 additions and 0 deletions
lectureCodeExamples/Week1/FundamentalsCode/BasicHTMLSkeleton.html 0 → 100755
+ 30
− 0
View file @ 89ec063e
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<!-- For responsive page -->
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="description" content="Basic HTML5 Document" />
<meta name="keywords" content="HTML5, Responsive" />
<link rel="shortcut icon" href="umd.png" type="image/png">
<title>HTML TEMPLATE</title>
</head>
<body>
<strong><q>YOUR HTML CODE GOES HERE</q></strong>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sunt iusto quod suscipit
earum consequuntur! Aliquam harum neque debitis reprehenderit eum omnis odit,
optio corrupti a cupiditate amet, possimus animi mollitia?
Lorem ipsum dolor sit amet consectetur adipisicing elit. Nesciunt
possimus sit sed, doloribus ipsam sequi maxime tempora placeat earum
eum. Alias dolore accusantium omnis consequuntur? Assumenda accusantium
est id autem quo?
</p>
</body>
</html>
\ No newline at end of file
lectureCodeExamples/Week1/FundamentalsCode/umd.png 0 → 100755
+ 0
− 0
View file @ 89ec063e
lectureCodeExamples/Week1/FundamentalsCode/umd.png

835 B

lectureCodeExamples/Week1/HTMLBasicsCode/BasicHTMLSkeleton.html 0 → 100755
+ 30
− 0
View file @ 89ec063e
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<!-- For responsive page -->
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="description" content="Basic HTML5 Document" />
<meta name="keywords" content="HTML5, Responsive" />
<link rel="shortcut icon" href="umd.png" type="image/png" />
<title>HTML TEMPLATE</title>
</head>
<body>
<strong><q>YOUR HTML CODE GOES HERE</q></strong>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sunt iusto quod suscipit
earum consequuntur! Aliquam harum neque debitis reprehenderit eum omnis odit,
optio corrupti a cupiditate amet, possimus animi mollitia?
Lorem ipsum dolor sit amet consectetur adipisicing elit. Nesciunt
possimus sit sed, doloribus ipsam sequi maxime tempora placeat earum
eum. Alias dolore accusantium omnis consequuntur? Assumenda accusantium
est id autem quo?
</p>
</body>
</html>
lectureCodeExamples/Week1/HTMLBasicsCode/CharacterReferences.html 0 → 100755
+ 87
− 0
View file @ 89ec063e
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Character References</title>
</head>
<body>
<table>
<tr>
<th>Name</th>
<th>Symbol</th>
</tr>
<tr>
<td>Copyright</td>
<td>&copy;</td>
</tr>
<tr>
<td>Registered Trademark</td>
<td>&reg;</td>
</tr>
<tr>
<td>Ampersand</td>
<td>&amp;</td>
</tr>
<tr>
<td>Less than</td>
<td>&lt;</td>
</tr>
<tr>
<td>Greater than</td>
<td>&gt;</td>
</tr>
<tr>
<td>Right Arrow</td>
<td>&rarr;</td>
</tr>
<tr>
<td>Left Arrow</td>
<td>&larr;</td>
</tr>
<tr>
<td>Non-breaking space</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>Pi</td>
<td>&pi;</td>
</tr>
<tr>
<td>Degree</td>
<td>&deg;</td>
</tr>
<tr>
<td>Acute</td>
<td>&acute;</td>
</tr>
<tr>
<td>Infinity</td>
<td>&infin;</td>
</tr>
</table>
<br><br>
<table>
<tr>
<th>Unicode</th>
<th>Symbol</th>
</tr>
<tr>
<td>Clover</td>
<td>&#x2660;</td>
</tr>
<tr>
<td>SHAMROCK</td>
<td>&#x2618;</td>
</tr>
<tr>
<td>BLACK CHESS QUEEN</td>
<td>&#x265B;</td>
</tr>
</table>
</body></html>
\ No newline at end of file
lectureCodeExamples/Week1/HTMLBasicsCode/CommonTags.html 0 → 100755
+ 69
− 0
View file @ 89ec063e
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Common Tags</title>
</head>
<body>
<h1>Introduction(h1)</h1>
<h2>Overview(h2)</h2>
<h3>Conclusion(h3)</h3>
<h4>References(h4)</h4>
<h5>Appendix A(h5)</h5>
<h6>Appendix B(h6)</h6>
<p>
This document presents some frequently used tags for the
development of html files. For example, the text you are currently
reading is enclosed in &lt;p&gt; &lt;/p&gt; tags.
</p>
<p>
This line illustrates that we <b>can bold</b> easily with the
&lt;b&gt; tag.
</p>
<p>
Now we are illustrating how we can create superscripts
(10<sup>th</sup>) or subscript (log<sub> 2 </sub> n)
</p>
<p>
Showing how to generate quotes: <q>To be or not to be</q>
</p>
<p>Java code printed using the pre tags:
</p>
<pre>
/* Java code presented using the <strong>pre tag</strong> */
import javax.swing.*;
public static void main(String[] args) {
System.out.println("Hello World");
}
</pre>
<p>Java code printed using p tags:
</p>
<p>
/* Java code presented using the <strong>pre tag</strong> */
import javax.swing.*;
public static void main(String[] args) {
System.out.println("Hello World");
}
</p>
<p>
<em>This line has been displayed using the &lt;em&gt;
tag</em><br /> <strong>This line has been displayed using the
&lt;strong&gt; tag</strong><br /> <b>This line has been
displayed using the &lt;b&gt; tag</b><br /> <i>This line has
been displayed using the &lt;i&gt; tag</i><br />
</p>
</body>
</html>
lectureCodeExamples/Week1/HTMLBasicsCode/CourseDescription.pdf 0 → 100755
+ 0
− 0
View file @ 89ec063e
File added
lectureCodeExamples/Week1/HTMLBasicsCode/DataPage.html 0 → 100755
+ 33
− 0
View file @ 89ec063e
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Data Page</title>
<style>
#p1 {
margin-bottom: 70rem;
}
</style>
</head>
<body>
<h1>Bookmarks</h1>
<p id="p1">
<a href="http://www.cnn.com">CNN Web Page</a>
<a href="http://www.cbs.com">CBS Web Page</a>
<a href="http://www.nbc.com">NBC Web Page</a>
<a href="http://www.pbs.com">PBS Web Page</a>
</p>
<h1 id="data">Data Sources</h1> <!-- id attribute allow us to create bookmark -->
<p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Adipisci, quibusdam. Commodi iure sapiente maiores reiciendis repudiandae iste labore consectetur quam unde dolores, nesciunt eligendi repellat qui quod? Delectus, ipsam maiores.
Lorem ipsum, dolor sit amet consectetur adipisicing elit. Ea autem error quidem earum. Voluptas ipsa harum doloribus facilis? Tempora sequi unde cum cumque culpa ad aliquam vitae nesciunt soluta odit voluptatem, a corporis deleniti dolorem rerum quisquam reiciendis voluptatum placeat? Quae sequi, aut quam mollitia tenetur architecto quo ipsam soluta veritatis, velit iure neque a ducimus consectetur? Nesciunt modi consectetur eaque beatae atque maxime saepe sapiente tempore cupiditate, non quae. Quidem quos expedita eum fuga aliquid autem natus ab deleniti, illum repudiandae, aliquam ea placeat dolorum excepturi nobis porro officia magni at tempora iusto temporibus nostrum nemo? Soluta culpa aspernatur quas odio sint aperiam repellendus consequuntur quis odit aliquid? Cumque sit est non officiis autem quod exercitationem accusantium fugiat, voluptate illo consequatur deserunt, doloremque quisquam, corporis molestiae beatae minima quaerat esse consectetur assumenda laborum. Quasi, ducimus? Nostrum animi quo qui porro reprehenderit. Aspernatur harum suscipit, sequi molestias id itaque! Accusantium eligendi neque saepe? Porro repudiandae beatae tempora, illum reprehenderit unde consequatur, atque totam aut, recusandae debitis natus a exercitationem soluta eaque fuga voluptates voluptas deleniti harum? Tempora deserunt similique quae consequuntur, culpa distinctio, odit possimus nulla nam accusantium fugit. Enim quia nobis possimus obcaecati perspiciatis doloremque deserunt facilis aspernatur quas maiores tempore, harum ipsa incidunt cupiditate a sint commodi culpa eos ratione. Libero error necessitatibus non asperiores est sapiente dignissimos natus animi iure eius? Ad qui asperiores inventore aliquam dolorum aliquid laborum, voluptatibus laboriosam velit temporibus aperiam amet. Excepturi facere consequuntur inventore illum quibusdam non! Eum labore libero omnis eius provident magnam temporibus voluptates consequatur? Enim quasi maxime animi unde labore alias vitae quidem quo minima, sit aliquid corrupti voluptates? Itaque pariatur eius fugiat molestiae sit eaque iste in praesentium ipsa illo expedita, nisi corporis totam nihil quos ab quo soluta quasi minima excepturi alias id fuga velit? Illo recusandae incidunt fuga repudiandae molestiae dolorem temporibus corrupti neque minus, dolor et odit, doloribus odio voluptatibus vero esse aspernatur aperiam! Odio quisquam provident inventore quam, hic iusto? Voluptate necessitatibus sequi, accusantium at dicta accusamus. Minus quod quibusdam quidem obcaecati cupiditate doloribus consequatur vero itaque perspiciatis sed quos, voluptate aspernatur aut explicabo? Voluptate rem temporibus iusto, esse, obcaecati id unde sunt enim a quam veniam quasi, cumque aspernatur dolores ratione impedit voluptatem ea eos magnam vero eum necessitatibus. Aliquid voluptas obcaecati a soluta fugiat officiis eligendi quidem nulla necessitatibus cum pariatur, maiores id. Doloribus itaque possimus minima delectus inventore, tempora voluptatum recusandae incidunt voluptates voluptatibus labore alias fugiat distinctio accusantium autem in quod deleniti officiis consectetur sunt, ipsam officia adipisci molestias! Cupiditate provident laboriosam minima quae saepe suscipit minus exercitationem perferendis, laudantium ipsa, voluptas debitis perspiciatis in velit adipisci voluptatum ipsam temporibus veritatis hic officia. Illo ab quisquam officiis sequi iusto natus voluptatum ducimus neque itaque enim explicabo, rem quo sint dolores exercitationem minima et impedit cumque. Libero praesentium aliquid temporibus tenetur, nobis reiciendis dolore. Minima voluptatem qui accusamus ratione nobis quae facilis amet officia rerum voluptates, aperiam ducimus libero expedita incidunt voluptas, corrupti tenetur ea voluptatibus. Eveniet voluptatum facere culpa pariatur quis eligendi! Iste error pariatur, exercitationem nihil animi porro architecto sit deserunt voluptatibus! Inventore facilis quaerat omnis temporibus incidunt placeat, labore sed saepe laboriosam possimus veniam esse magnam quo. Inventore itaque ducimus ab, nostrum, quia, aut sequi eum officiis reiciendis quo nemo est modi cupiditate ea omnis doloribus. Ut accusamus quidem, et cupiditate officiis earum doloribus illo, harum necessitatibus sit nihil eaque molestiae libero at, quo excepturi quisquam animi nulla similique optio eveniet voluptatum dolores atque ad? Impedit temporibus hic provident, perferendis delectus quam amet cum esse, voluptatibus et ea labore officiis aspernatur unde a veritatis. Unde nostrum quaerat assumenda expedita eum totam repudiandae laudantium molestias, doloribus voluptates amet ex minus alias aspernatur rem inventore, corporis, aliquid in cum? Culpa reiciendis minus iusto quasi expedita molestias mollitia esse ratione atque velit! Iure veritatis facere amet voluptates commodi cupiditate, deleniti magnam sapiente odio dolores voluptatum accusantium dolore nisi voluptas? Vitae enim provident quasi corrupti ipsam soluta sit fugit amet deleniti quos velit possimus, quas aliquid dolores est quam praesentium quis, facilis nemo nisi unde voluptate? Nam quod laborum dignissimos quisquam maiores nemo inventore eius impedit sequi blanditiis. Unde veniam neque omnis quidem nostrum dolores velit adipisci odit alias vel, illum, assumenda quisquam consequatur asperiores molestiae accusantium. Soluta iure repellendus magnam quidem ea sit cumque at illum ducimus repudiandae consectetur corrupti, aperiam unde velit a pariatur quibusdam optio accusantium sequi nam. Iusto quidem quod optio porro, architecto nostrum reiciendis rem. Ullam repudiandae voluptatem excepturi facere fugiat nostrum nihil, optio voluptate porro impedit culpa qui dolorum? Incidunt ipsum nostrum doloribus dignissimos quisquam itaque sapiente sint, ut deleniti! Doloribus recusandae, officiis, saepe quaerat vitae nesciunt suscipit excepturi, illum ex deleniti porro eligendi? Vel magnam deserunt asperiores possimus dolorem temporibus quisquam unde id beatae pariatur nostrum totam veritatis numquam hic at quia, commodi sunt, excepturi perspiciatis ipsum cumque molestias? Nulla quaerat ullam qui iure neque sed temporibus aperiam voluptate nesciunt velit, eligendi perspiciatis iste impedit veritatis ipsum architecto commodi debitis perferendis? Dolore deleniti autem iste laborum suscipit ratione quis earum quas odit, cumque tenetur, alias vitae rerum excepturi fuga corporis laboriosam numquam quia. Quis doloribus ut ipsum cumque perferendis doloremque laborum voluptatibus aspernatur vel? Sunt maiores modi eveniet accusantium ea soluta officiis aliquam unde, nobis accusamus, minus fugit, dicta laborum commodi provident asperiores excepturi ipsa ullam culpa veniam pariatur. Provident porro reiciendis at minima, totam culpa consequuntur sapiente incidunt hic laudantium neque? Labore magni animi perferendis a praesentium deleniti laboriosam repellendus ratione numquam maiores, minima quia aperiam voluptas aspernatur aut atque ducimus mollitia quibusdam rerum corporis pariatur culpa! Recusandae nostrum iste illum dolores delectus harum asperiores obcaecati, dolorem officiis quidem tenetur amet, voluptates soluta perferendis? Possimus molestias ratione, rerum reiciendis eaque ad iusto sunt esse dolorem! Nobis nihil, doloribus eos, corporis vero dignissimos laudantium illum vel perferendis accusamus soluta dolore obcaecati, ipsa iste aperiam! Inventore libero asperiores est exercitationem! Rerum quaerat magni ab, minus suscipit, laborum alias dignissimos, rem minima omnis illo corporis repudiandae quos sapiente voluptates molestiae est? Optio ducimus aspernatur nostrum possimus veniam!
</p>
</body>
</html>
\ No newline at end of file
lectureCodeExamples/Week1/HTMLBasicsCode/Image.html 0 → 100755
+ 22
− 0
View file @ 89ec063e
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Image</title>
</head>
<body>
<p>The School mascot is Testudo.
<img src="testudo.jpg" width="84" height="111" alt="Testudos' image'">
</p>
<p> Galaxy photo
<img src="galaxy.jpeg" alt="galaxy" style="max-width: 100%; height: auto">
<img src="galaxy.jpeg" alt="galaxy" style="width: 100px; height: 200px">
</p>
</body>
</html>
\ No newline at end of file
lectureCodeExamples/Week1/HTMLBasicsCode/Links.html 0 → 100755
+ 70
− 0
View file @ 89ec063e
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link href="favicon.ico" rel="icon" type="image/x-icon" />
<title>Links</title>
<style>
#p1 {
margin-bottom: 70rem;
}
</style>
</head>
<body>
<h1>Link Examples</h1>
<p id="p1">
<a href="http://www.cnn.com" target="_self">CNN Web Page</a>
<br><br>
<a href="https://unsplash.com/photos/fUnfEz3VLv4"><img src="galaxy.jpeg" alt="galaxy" style="max-width: 100%; height:
auto"></a>
<br /><br />
<a href="Image.html">Image Example Page</a>
<!-- bookmarks allow us to jump to specific parts of a page -->
<a href="#courseInfo">Course Info</a>
<!-- if the bookmark is in another page it can be accessed as follows: -->
<a href="DataPage.html#data">Bookmark to Data</a>
<!-- <a href="#">Current Page Link</a> -->
<!-- Opens page in new window/tab -->
<br><br>
<a href="Image.html" target="_blank">Image Example Page in New Window/Tab</a>
</p>
<h2 id="courseInfo">Course Info</h2> <!-- id attribute allow us to create bookmark -->
<p>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Libero culpa corporis
delectus nisi quod ullam
quisquam, laborum temporibus voluptas saepe blanditiis quasi earum, nobis beatae
autem inventore nostrum atque
voluptate laudantium. Corrupti, facere. Corporis aspernatur vitae ipsam veritatis
dolore quaerat, alias dolorum
labore beatae expedita aliquid dicta cumque inventore et omnis fuga officia ab?
Perspiciatis hic aliquam,
consequatur incidunt laborum reiciendis id eligendi quo? Vel blanditiis vero
voluptates ex officiis commodi
inventore officia, autem delectus voluptatum dolores reprehenderit perspiciatis
suscipit. Explicabo modi
sapiente nulla aut eligendi.
</p>
<a href="#">Current Page Link</a>
<ul>
<li><a href="https://en.es-static.us/upl/2013/09/sunrise-red-sea-Graham-Telford-e1489764712368.jpg">
<img src="https://en.es-static.us/upl/2013/09/sunrise-red-sea-Graham-Telford-e1489764712368.jpg" alt="sunset" style="max-width: 100%; height: auto">
</a>
</li>
<li><a href="CourseDescription.pdf">CourseDescription.pdf</a></li>
<li><a href="#p1">link to id p1</a></li>
</ul>
</body></html>
\ No newline at end of file
lectureCodeExamples/Week1/HTMLBasicsCode/Lists.html 0 → 100755
+ 56
− 0
View file @ 89ec063e
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Lists</title>
</head>
<body>
<h2>Unordered List</h2>
<ul>
<li>Java</li>
<li>PHP</li>
</ul>
<h2>Ordered List</h2>
<ol>
<li>Java</li>
<li>PHP</li>
</ol>
<h2>Ordered List (Reversed)</h2>
<ol reversed>
<li>Java</li>
<li>PHP</li>
</ol>
<h2>Nested Lists</h2>
<ol>
<li>Old Languages
<ol>
<li>Fortran</li>
<li>C</li>
</ol>
</li>
<li>New Languages
<ul>
<li>JavaScript</li>
<li>C#</li>
</ul>
</li>
</ol>
<h2>Definition List</h2>
<dl>
<dt>cmsc131</dt>
<dd>First Java Course</dd>
<dt>cmsc132</dt>
<dd>Second Java Course</dd>
</dl>
</body>
</html>
lectureCodeExamples/Week1/HTMLBasicsCode/TableNoBorders.html 0 → 100755
+ 28
− 0
View file @ 89ec063e
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Table No Borders</title>
</head>
<body>
<table>
<caption>Basic Table</caption>
<tr>
<th></th>
<th>Exam1</th>
<th>Exam2</th>
</tr>
<tr>
<td>Student1</td>
<td>10</td>
<td>100</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
</table>
</body></html>
lectureCodeExamples/Week1/HTMLBasicsCode/TableTheadTbody.html 0 → 100755
+ 45
− 0
View file @ 89ec063e
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Tables</title>
<style>
table,
td,
th {
border: 1px solid gray
}
</style>
</head>
<body>
<table>
<thead>
<tr>
<th>Assignment</th>
<th>Grade</th>
</tr>
</thead>
<tbody>
<tr>
<td>Project #1</td>
<td>100</td>
</tr>
<tr>
<td>Project #2</td>
<td>90</td>
</tr>
</tbody>
<tfoot>
<tr>
<td colspan="2">UMCP CS Dept</td>
</tr>
</tfoot>
</table>
</body>
</html>
lectureCodeExamples/Week1/HTMLBasicsCode/TableWithBorders.html 0 → 100755
+ 81
− 0
View file @ 89ec063e
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Tables</title>
</head>
<body>
<table border="1">
<caption><em>Table Border 1</em></caption>
<tr>
<th></th>
<th>Exam1</th>
<th>Exam2</th>
</tr>
<tr>
<td>Student1</td>
<td>10</td>
<td>100</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
</table>
<!-- Table with colspan -->
<table border="1">
<caption><em>Table with colspan</em></caption>
<tr>
<th colspan="2">Exam1</th><th>Exam2</th>
</tr>
<tr>
<td>Student1</td>
<td>10</td>
<td>100</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
</table>
<!-- Table with rowspan (notice thead/tbody) -->
<table border="1">
<caption><em>Table with rowspan</em></caption>
<thead>
<tr>
<th></th>
<th>Exam1</th>
<th>Exam2</th>
</tr>
</thead>
<tbody>
<tr>
<td>Student1</td>
<td>10</td>
<td>100</td>
</tr>
<tr>
<td rowspan="3">Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr> <!-- Notice only two entries -->
<td>40(Retaken)</td>
<td>400(Retaken)</td>
</tr>
<tr> <!-- Notice only two entries -->
<td>60(Retaken)</td>
<td>600(Retaken)</td>
</tr>
</tbody>
</table>
</body>
</html>
\ No newline at end of file
lectureCodeExamples/Week1/HTMLBasicsCode/TableWithBordersLongTable.html 0 → 100755
+ 344
− 0
View file @ 89ec063e
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Long Table</title>
<style>
table,
td,
th {
border: 1px solid gray
}
</style>
</head>
<body>
<p>In Chrome try <strong>Print...</strong> and then selecting
<strong>"Save as PDF".</strong><br><br>
<em>Notice how headers appear on each page</em>
</p>
<!-- long table -->
<table>
<caption><em>Long Table</em></caption>
<thead>
<tr>
<th></th>
<th>Exam1</th>
<th>Exam2</th>
</tr>
</thead>
<tbody>
<tr>
<td>Student1</td>
<td>10</td>
<td>100</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<th>Student2</th>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
<tr>
<td>Student2</td>
<td>20</td>
<td>200</td>
</tr>
</tbody>
</table>
</body></html>
lectureCodeExamples/Week1/HTMLBasicsCode/galaxy.jpeg 0 → 100755
+ 0
− 0
View file @ 89ec063e
lectureCodeExamples/Week1/HTMLBasicsCode/galaxy.jpeg

1.07 MiB

lectureCodeExamples/Week1/HTMLBasicsCode/testudo.jpg 0 → 100755
+ 0
− 0
View file @ 89ec063e
lectureCodeExamples/Week1/HTMLBasicsCode/testudo.jpg

3.13 KiB

lectureCodeExamples/Week1/HTMLBasicsCode/umd.png 0 → 100755
+ 0
− 0
View file @ 89ec063e
lectureCodeExamples/Week1/HTMLBasicsCode/umd.png

835 B

lectureCodeExamples/Week1/HTMLCode/BlockInline.html 0 → 100755
+ 22
− 0
View file @ 89ec063e
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Block/Inline Elements</title>
</head>
<body>
<p>This is a paragram and represents a block element. It extends the full width of the page. <strong>Try resizing this page and see how the paragraph changes</strong></p><p>Even though this HTML is
part on the first line it will be display vertically.</p>
<h1>Heading which is a block element</h1><ul><li>list is also a block element</li></ul>
<p>Images are inline elements <img src="testudo.jpg" alt="testudo's image"><img src="umd.png" alt="umd's image"><img src="testudo.jpg" alt="testudo's image">and appear one after another on a line.
<img src="testudo.jpg" alt="testudo's image">
<img src="testudo.jpg" alt="testudo's image">
<img src="testudo.jpg" alt="testudo's image">
<strong>Try resizing the page and see how the images are repositioned.</strong>
</p>
</body>
</html>
\ No newline at end of file
lectureCodeExamples/Week1/HTMLCode/GlobalAttributes.html 0 → 100755
+ 69
− 0
View file @ 89ec063e
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Global Attributes</title>
<style>
table,
th,
td {
border: 0.125em solid black;
}
</style>
</head>
<body>
<h1>Global Attributes</h1>
<p contenteditable>This is a paragraph can be modify by the user. Click on
this and edit the text.
</p>
<!-- <hr> creates a horizontal rule -->
<hr>
<h2>Schedule</h2>
<table>
<tr>
<th>Day</th>
<th>Supervisor</th>
</tr>
<tr>
<td>Monday</td>
<td contenteditable>John (can be changed)</td>
</tr>
</table>
<hr>
<h2>Todo List (Feel free to add more tasks or edit current ones)</h2>
<ol contenteditable>
<li>Study</li>
<li>Work on the project</li>
</ol>
<hr>
<h2>Draggable Image</h2>
<p>
<img src="testudo.jpg" alt="testudo's image" draggable>
</p>
<hr>
<h2>Dragged Element Will Be Copied (can copy multiple times)</h2>
<div contenteditable dropzone="copy">
</div>
<hr>
<h2>To See Hidden</h2>
<p>
The secret text below is hidden. Edit HTML and remove hidden attribute
</p>
<h3>Secret Is</h3>
<p hidden>
The secret is to submit the project early.
</p>
</body>
</html>
lectureCodeExamples/Week1/HTMLCode/Html5Elements.html 0 → 100755
+ 74
− 0
View file @ 89ec063e
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>HTML5 Elements</title>
</head>
<body>
<header>
<h1>Review Site</h1>
</header>
<nav>
<a href="http://www.umd.edu">UMD Web Site</a>
</nav>
<main>
<article class="programming_languages_reviews">
<header>
<h2>Java</h2>
</header>
<section class="faculty_reviews">
<h2>Faculty Reviews</h2>
<article class="faculty_review">
<h2>Dr. JavaJava</h2>
<p>Great Language</p>
<footer>
<p>Submitted on <time datetime="2016-01-04 17:00">Jan 4</time>
</p>
</footer>
</article>
<article class="faculty_review">
<h2>Dr. AssemblyAssembly</h2>
<p>I prefer Assembly</p>
<footer>
<p>Submitted on <time datetime="2016-01-02 14:00">Jan 2</time>
</p>
</footer>
</article>
<article class="faculty_review">
<h2>Dr. JavaScript</h2>
<p>I prefer JavaScript</p>
<footer>
<p>Lorem ipsum voluptatem quisquam alias quam itaque enim sit
laudantium doloremque fuga laborum officiis accusamus
deserunt
sint porro? <span style="display: inline-block; margin-top: 100px;
">Aliquid</span>
repellat sed quas ipsa vitae, tenetur sit error expedita
dicta. In incidunt quaerat odio delectus, magni iste
fugit,
quis rerum quae similique consequatur consectetur nemo.
Laboriosam?</p>
</footer>
</article>
</section>
<footer>
<p>UMCP Java Reviews</p>
</footer>
</article>
</main>
<footer>
&copy;UMCP
</footer>
</body>
</html>
\ No newline at end of file
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment