You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
63 lines
2.0 KiB
HTML
63 lines
2.0 KiB
HTML
1 year ago
|
<!DOCTYPE HTML>
|
||
|
|
<html>
|
||
|
|
<head>
|
||
|
|
<title>Activity: CSS Introduction</title>
|
||
|
|
|
||
|
|
<!-- External CSS -->
|
||
|
|
<link rel="stylesheet" type="text/css" href="./index.css">
|
||
|
|
<style>
|
||
|
|
#internal {
|
||
|
|
color: orange;
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
<!-- Task: Ron START-->
|
||
|
|
<!-- Different ways to include CSS -->
|
||
|
|
<p style="color: red;">Apply inline styling here.</p>
|
||
|
|
<p id="internal">Apply internal styling here.</p>
|
||
|
|
<p class="external">Apply external styling here.</p>
|
||
|
|
<!-- Task: Ron END-->
|
||
|
|
|
||
|
|
<!-- Task: Chris START-->
|
||
|
|
<!-- CSS Selectors -->
|
||
|
|
<h1>CSS Introduction Activity</h1>
|
||
|
|
|
||
|
|
<h2 id="sub-header">The following are things you will learn in this bootcamp:</h2>
|
||
|
|
|
||
|
|
<h3>Languages to be Learned</h3>
|
||
|
|
<ol>
|
||
|
|
<li class="text-green">Hypertext Markup Language</li>
|
||
|
|
<li class="text-green">Cascading Style Sheet</li>
|
||
|
|
<li class="text-green">JavaScript</li>
|
||
|
|
</ol>
|
||
|
|
<!-- Task: Chris END-->
|
||
|
|
|
||
|
|
<!-- Task: JP START-->
|
||
|
|
<h3>Tools to be Used</h3>
|
||
|
|
<ol>
|
||
|
|
<li class="border-blue">Sublime Text</li>
|
||
|
|
<li class="border-blue">Postman</li>
|
||
|
|
<li class="border-blue">Heroku</li>
|
||
|
|
<li class="border-blue">GitLab</li>
|
||
|
|
</ol>
|
||
|
|
|
||
|
|
<!-- Combinator Selectors -->
|
||
|
|
<section>
|
||
|
|
<h4>Other Things to be Learned</h4>
|
||
|
|
<img src="https://upload.wikimedia.org/wikipedia/commons/thumb/9/99/Unofficial_JavaScript_logo_2.svg/480px-Unofficial_JavaScript_logo_2.svg.png">
|
||
|
|
<ul>
|
||
|
|
<li>Node.js</li>
|
||
|
|
<li>Express.js</li>
|
||
|
|
<li>React.js</li>
|
||
|
|
<li>MongoDB</li>
|
||
|
|
</ul>
|
||
|
|
<!-- Task: JP END-->
|
||
|
|
|
||
|
|
<!-- Task: Joshua START-->
|
||
|
|
<p>Web development is a continuous process. Never stop learning and always look for ways to innovate.</p>
|
||
|
|
</section>
|
||
|
|
<!-- Task: Joshua END-->
|
||
|
|
|
||
|
|
</body>
|
||
|
|
</html>
|