0% found this document useful (0 votes)
10 views3 pages

Index HTML

Uploaded by

judedautey20
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
10 views3 pages

Index HTML

Uploaded by

judedautey20
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
You are on page 1/ 3

<!

DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Elective Mathematics - Year 1, Section 1</title>
<style>
/* Basic Styles */
body { font-family: Arial, sans-serif; margin: 0; padding: 0; background-color:
#f4f4f4; }
header { background-color: #333; color: white; padding: 10px 0; text-align:
center; }
nav { background-color: #333; padding: 10px; color: white; }
nav ul { list-style-type: none; padding: 0; }
nav ul li { display: inline; margin-right: 15px; }
nav ul li a { color: white; text-decoration: none; }
main { padding: 20px; }
.tab { margin-top: 20px; }
.tab button { padding: 10px; background-color: #333; color: white; border:
none; cursor: pointer; }
.tab button:hover { background-color: #555; }
.tab-content { display: none; margin-top: 10px; padding: 15px; background-
color: white; border-radius: 5px; }
.active { display: block; }
</style>
<script>
function toggleTab(tabName) {
var i, tabContent, tabButtons;
tabContent = document.getElementsByClassName("tab-content");
for (i = 0; i < tabContent.length; i++) {
tabContent[i].classList.remove("active");
}
tabButtons = document.getElementsByClassName("tab-button");
for (i = 0; i < tabButtons.length; i++) {
tabButtons[i].classList.remove("active");
}
document.getElementById(tabName).classList.add("active");
document.querySelector("[data-tab='" + tabName +
"']").classList.add("active");
}
</script>
</head>
<body>
<header>
<h1>Elective Mathematics - Year 1, Section 1</h1>
</header>

<nav>
<ul>
<li><a href="javascript:void(0);" class="tab-button" data-tab="content"
onclick="toggleTab('content')">Content</a></li>
<li><a href="javascript:void(0);" class="tab-button" data-tab="worksolutions"
onclick="toggleTab('worksolutions')">Work Solutions</a></li>
<li><a href="javascript:void(0);" class="tab-button" data-tab="quiz"
onclick="toggleTab('quiz')">Quiz</a></li>
<li><a href="javascript:void(0);" class="tab-button" data-tab="laboratory"
onclick="toggleTab('laboratory')">Laboratory</a></li>
<li><a href="javascript:void(0);" class="tab-button" data-tab="resources"
onclick="toggleTab('resources')">Resources</a></li>
<li><a href="javascript:void(0);" class="tab-button" data-tab="projects"
onclick="toggleTab('projects')">Projects</a></li>
<li><a href="javascript:void(0);" class="tab-button" data-tab="dictionary"
onclick="toggleTab('dictionary')">Dictionary</a></li>
</ul>
</nav>

<main>
<div id="content" class="tab-content active">
<h2>Content: Introduction to Algebra</h2>
<p>In this section, we will cover the basics of algebra including variables,
constants, expressions, and the principles of solving linear equations and
inequalities.</p>
<p>Algebra is a branch of mathematics that deals with variables and constants
in mathematical expressions and equations.</p>
<!-- Additional content here -->
</div>

<div id="worksolutions" class="tab-content">


<h2>Work Solutions: Solving Linear Equations</h2>
<p>Let's solve some linear equations:</p>
<ul>
<li>Example 1: Solve 2x + 3 = 7. Solution: (Step-by-step solution)</li>
<li>Example 2: Solve x/3 + 4 = 10. Solution: (Step-by-step solution)</li>
<!-- More examples and solutions -->
</ul>
</div>

<div id="quiz" class="tab-content">


<h2>Quiz: Algebra Basics</h2>
<p>Choose the correct answer:</p>
<ul>
<li>1. What is the value of x in the equation 3x - 5 = 16?</li>
<li>2. Which of the following is a linear equation?</li>
<!-- More quiz questions -->
</ul>
</div>

<div id="laboratory" class="tab-content">


<h2>Laboratory: Visualizing Linear Equations</h2>
<p>Interactive graphing tools can help us visualize linear equations.
(Include a link to interactive simulation)</p>
<!-- Simulation link and instructions -->
</div>

<div id="resources" class="tab-content">


<h2>Resources</h2>
<ul>
<li><a href="https://www.khanacademy.org/math/algebra" target="_blank">Khan
Academy - Algebra</a></li>
<li><a href="https://www.coursera.org/learn/algebra"
target="_blank">Coursera - Algebra Basics</a></li>
<!-- More resources -->
</ul>
</div>

<div id="projects" class="tab-content">


<h2>Projects</h2>
<p>Project 1: Building an Algebraic Equation Solver (Materials, Steps)</p>
<p>Project 2: Exploring Graphs of Linear Functions (Materials, Steps)</p>
</div>

<div id="dictionary" class="tab-content">


<h2>Dictionary</h2>
<p>Search for mathematical terms, symbols, and their meanings here.</p>
<!-- Searchable dictionary of terms -->
</div>
</main>
</body>
</html>

You might also like