Posted inQuiz Time
HTML Fundamentals Quiz
This is a quiz on the topic of ‘HTML Fundamentals’ designed to assess knowledge of essential HTML elements and their purposes. Key concepts covered include the roles of the ``, ``, ``, `<body>`, and various tags used for formatting and structuring content such as headings, paragraphs, lists, hyperlinks, and text styles. The quiz also addresses attributes used in links and the representation of colors, helping users to solidify their understanding of HTML structure and syntax.
<style>
.question {
padding: 5px;
cursor: pointer;
border: 1px solid black;
}
.explanation {
display: none;
border-radius: 15px;
border: 1px solid black;
padding: 10px;
margin-top: 10px;
background-color: lightgreen;
}
.selected-answer {
font-weight: bold;
text-decoration: underline;
}
#correctCount {
position: fixed;
bottom: 0;
left: 0;
width: 100%;
background-color: rgba(0, 0, 0, 0.7);
color: white;
text-align: center;
padding: 10px;
box-sizing: border-box;
font-size: 16px;
}
.correct {
background-color: lightgreen;
}
.incorrect {
background-color: pink;
}
</style>
<div id="correctCount">Correct Answers: 0</div>
<script>
function updateCorrectCount() {
var selectedAnswers = document.querySelectorAll('.selected-answer');
var correctCount = 0;
selectedAnswers.forEach(function(answer) {
if (answer.classList.contains('correct')) {
correctCount++;
}
});
var correctCountDiv = document.getElementById('correctCount');
correctCountDiv.textContent = 'Correct Answers: ' + correctCount + ' / 30';
}
function checkAnswer(questionNumber, correctAnswer, explanation) {
var answers = document.querySelectorAll('.question' + questionNumber);
answers.forEach(function(answer) {
answer.classList.remove('correct');
answer.classList.remove('selected-answer');
answer.style.backgroundColor = '';
});
answers.forEach(function(answer) {
if (answer.textContent === correctAnswer) {
answer.classList.add('correct');
}
});
event.target.classList.add('selected-answer');
event.target.style.backgroundColor = (event.target.textContent === correctAnswer) ? 'lightgreen' : 'pink';
var explanationDiv = document.getElementById('explanation' + questionNumber);
explanationDiv.textContent = explanation;
explanationDiv.style.display = 'block';
updateCorrectCount();
updateFinalScore();
}
updateCorrectCount();
updateFinalScore();
</script>
<div id="quiz"> <p><img alt='Start of HTML Fundamentals Quiz' src='/wp-content/uploads/HTML-Fundamentals-1.webp'></img></p>
<div id="ez-toc-container" class="ez-toc-v2_0_71 counter-hierarchy ez-toc-counter ez-toc-custom ez-toc-container-direction">
<div class="ez-toc-title-container">
<p class="ez-toc-title" style="cursor:inherit">Key sections in the article:</p>
<span class="ez-toc-title-toggle"><a href="#" class="ez-toc-pull-right ez-toc-btn ez-toc-btn-xs ez-toc-btn-default ez-toc-toggle" aria-label="Toggle Table of Content"><span class="ez-toc-js-icon-con"><span class=""><span class="eztoc-hide" style="display:none;">Toggle</span><span class="ez-toc-icon-toggle-span"><svg style="fill: #fc6668;color:#fc6668" xmlns="http://www.w3.org/2000/svg" class="list-377408" width="20px" height="20px" viewBox="0 0 24 24" fill="none"><path d="M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z" fill="currentColor"></path></svg><svg style="fill: #fc6668;color:#fc6668" class="arrow-unsorted-368013" xmlns="http://www.w3.org/2000/svg" width="10px" height="10px" viewBox="0 0 24 24" version="1.2" baseProfile="tiny"><path d="M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z"/></svg></span></span></span></a></span></div>
<nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class="ez-toc-link ez-toc-heading-1" href="#start-of-html-fundamentals-quiz" title="Start of HTML Fundamentals Quiz">Start of HTML Fundamentals Quiz</a></li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class="ez-toc-link ez-toc-heading-2" href="#quiz-successfully-completed" title="Quiz Successfully Completed!">Quiz Successfully Completed!</a></li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class="ez-toc-link ez-toc-heading-3" href="#html-fundamentals" title="HTML Fundamentals">HTML Fundamentals</a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class="ez-toc-link ez-toc-heading-4" href="#understanding-html" title="Understanding HTML">Understanding HTML</a></li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class="ez-toc-link ez-toc-heading-5" href="#html-elements-and-tags" title="HTML Elements and Tags">HTML Elements and Tags</a></li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class="ez-toc-link ez-toc-heading-6" href="#attributes-in-html" title="Attributes in HTML">Attributes in HTML</a></li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class="ez-toc-link ez-toc-heading-7" href="#semantic-html" title="Semantic HTML">Semantic HTML</a></li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class="ez-toc-link ez-toc-heading-8" href="#html-forms-and-input-elements" title="HTML Forms and Input Elements">HTML Forms and Input Elements</a></li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class="ez-toc-link ez-toc-heading-9" href="#what-is-html" title="What is HTML?">What is HTML?</a></li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class="ez-toc-link ez-toc-heading-10" href="#how-does-html-work" title="How does HTML work?">How does HTML work?</a></li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class="ez-toc-link ez-toc-heading-11" href="#where-is-html-used" title="Where is HTML used?">Where is HTML used?</a></li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class="ez-toc-link ez-toc-heading-12" href="#when-was-html-first-developed" title="When was HTML first developed?">When was HTML first developed?</a></li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class="ez-toc-link ez-toc-heading-13" href="#who-created-html" title="Who created HTML?">Who created HTML?</a></li></ul></li></ul></nav></div>
<h2><span class="ez-toc-section" id="start-of-html-fundamentals-quiz"></span>Start of HTML Fundamentals Quiz<span class="ez-toc-section-end"></span></h2>
<div>
<p>1. What is the purpose of the `<html>` element?</p>
<ul style="list-style-type: none;">
<li class="question1" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(1, 'The `<html>` element is the root element of the HTML page.’, ‘The `<html>` element serves as the root element that encompasses all other HTML elements on the page.’)”>The `<html>` element contains the page title.</li>
<li class="question1" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(1, 'The `<html>` element is the root element of the HTML page.’, ‘The `<html>` element serves as the root element that encompasses all other HTML elements on the page.’)”>The `<html>` element defines the webpage`s style.</li>
<li class="question1" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(1, 'The `<html>` element is the root element of the HTML page.’, ‘The `<html>` element serves as the root element that encompasses all other HTML elements on the page.’)”>The `<html>` element is the root element of the HTML page.</li>
<li class="question1" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(1, 'The `<html>` element is the root element of the HTML page.’, ‘The `<html>` element serves as the root element that encompasses all other HTML elements on the page.’)”>The `<html>` element manages user interactions.</li>
</ul>
<div id="explanation1" class="explanation" style="display: none; border-radius: 15px; border: 1px solid black; padding: 10px;"></div>
</div>
</br><div>
<p>2. What is the purpose of the `<head>` element?</p>
<ul style="list-style-type: none;">
<li class="question2" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(2, 'The `<head>` element contains metadata for the HTML page.’, ‘The `<head>` element contains metadata, which includes information about the document that is not displayed to the user, such as the title and links to stylesheets.’)”>The `<head>` element defines the document structure.</li>
<li class="question2" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(2, 'The `<head>` element contains metadata for the HTML page.’, ‘The `<head>` element contains metadata, which includes information about the document that is not displayed to the user, such as the title and links to stylesheets.’)”>The `<head>` element contains metadata for the HTML page.</li>
<li class="question2" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(2, 'The `<head>` element contains metadata for the HTML page.’, ‘The `<head>` element contains metadata, which includes information about the document that is not displayed to the user, such as the title and links to stylesheets.’)”>The `<head>` element displays visible content on the page.</li>
<li class="question2" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(2, 'The `<head>` element contains metadata for the HTML page.’, ‘The `<head>` element contains metadata, which includes information about the document that is not displayed to the user, such as the title and links to stylesheets.’)”>The `<head>` element is used for comments in HTML.</li>
</ul>
<div id="explanation2" class="explanation" style="display: none; border-radius: 15px; border: 1px solid black; padding: 10px;"></div>
</div>
</br><span class="display-ads-here"></span>
</br><div>
<p>3. What is the purpose of the `<title>` tag?</p>
<ul style="list-style-type: none;">
<li class="question3" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(3, 'The `<title>` tag produces a title for the webpage.’, ‘The `<title>` tag is used to specify the title of the webpage, which appears in the browser tab and search engine results.’)”>The `<title>` tag produces a title for the webpage.</li>
<li class="question3" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(3, 'The `<title>` tag produces a title for the webpage.’, ‘The `<title>` tag is used to specify the title of the webpage, which appears in the browser tab and search engine results.’)”>The `<title>` tag adds a footer to the webpage.</li>
<li class="question3" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(3, 'The `<title>` tag produces a title for the webpage.’, ‘The `<title>` tag is used to specify the title of the webpage, which appears in the browser tab and search engine results.’)”>The `<title>` tag displays images on the webpage.</li>
<li class="question3" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(3, 'The `<title>` tag produces a title for the webpage.’, ‘The `<title>` tag is used to specify the title of the webpage, which appears in the browser tab and search engine results.’)”>The `<title>` tag defines styles for the webpage.</li>
</ul>
<div id="explanation3" class="explanation" style="display: none; border-radius: 15px; border: 1px solid black; padding: 10px;"></div>
</div>
</br><div>
<p>4. What is the purpose of the `<body>` element?</p>
<ul style="list-style-type: none;">
<li class="question4" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(4, 'The `<body>` element defines the body of the document and contains all visible content.’, ‘The `<body>` element is the main section of an HTML document where all the content that is displayed to users is placed.’)”>The `<body>` element defines the body of the document and contains all visible content.</li>
<li class="question4" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(4, 'The `<body>` element defines the body of the document and contains all visible content.’, ‘The `<body>` element is the main section of an HTML document where all the content that is displayed to users is placed.’)”>The `<body>` element is used to create hyperlinks in a document.</li>
<li class="question4" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(4, 'The `<body>` element defines the body of the document and contains all visible content.’, ‘The `<body>` element is the main section of an HTML document where all the content that is displayed to users is placed.’)”>The `<body>` element provides metadata for the webpage.</li>
<li class="question4" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(4, 'The `<body>` element defines the body of the document and contains all visible content.’, ‘The `<body>` element is the main section of an HTML document where all the content that is displayed to users is placed.’)”>The `<body>` element is used to define styles for the document.</li>
</ul>
<div id="explanation4" class="explanation" style="display: none; border-radius: 15px; border: 1px solid black; padding: 10px;"></div>
</div>
</br><div>
<p>5. Which HTML tag is used to define a heading?</p>
<ul style="list-style-type: none;">
<li class="question5" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(5, '<h1>‘, ‘The <h1> tag is used to define a heading in HTML.’)”><title></li>
<li class="question5" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(5, '<h1>‘, ‘The <h1> tag is used to define a heading in HTML.’)”><footer></li>
<li class="question5" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(5, '<h1>‘, ‘The <h1> tag is used to define a heading in HTML.’)”><h1></li>
<li class="question5" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(5, '<h1>‘, ‘The <h1> tag is used to define a heading in HTML.’)”><head></li>
</ul>
<div id="explanation5" class="explanation" style="display: none; border-radius: 15px; border: 1px solid black; padding: 10px;"></div>
</div>
</br><span class="display-ads-here"></span>
</br><div>
<p>6. How many sizes of headers are available in HTML by default?</p>
<ul style="list-style-type: none;">
<li class="question6" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(6, 'Six', 'Six sizes of headers are available in HTML by default, ranging from `<h1>` to `<h6>`.’)”>Three</li>
<li class="question6" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(6, 'Six', 'Six sizes of headers are available in HTML by default, ranging from `<h1>` to `<h6>`.’)”>Seven</li>
<li class="question6" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(6, 'Six', 'Six sizes of headers are available in HTML by default, ranging from `<h1>` to `<h6>`.’)”>Six</li>
<li class="question6" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(6, 'Six', 'Six sizes of headers are available in HTML by default, ranging from `<h1>` to `<h6>`.’)”>Five</li>
</ul>
<div id="explanation6" class="explanation" style="display: none; border-radius: 15px; border: 1px solid black; padding: 10px;"></div>
</div>
</br><div>
<p>7. Which HTML tag is used to define a paragraph?</p>
<ul style="list-style-type: none;">
<li class="question7" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(7, '`<p>`’, ‘The `<p>` tag is used to define a paragraph in HTML.’)”>`<div>`</li>
<li class="question7" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(7, '`<p>`’, ‘The `<p>` tag is used to define a paragraph in HTML.’)”>`<p>`</li>
<li class="question7" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(7, '`<p>`’, ‘The `<p>` tag is used to define a paragraph in HTML.’)”>`<span>`</li>
<li class="question7" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(7, '`<p>`’, ‘The `<p>` tag is used to define a paragraph in HTML.’)”>`<header>`</li>
</ul>
<div id="explanation7" class="explanation" style="display: none; border-radius: 15px; border: 1px solid black; padding: 10px;"></div>
</div>
</br><div>
<p>8. How are quotations defined in HTML?</p>
<ul style="list-style-type: none;">
<li class="question8" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(8, 'Quotations are defined in HTML using the `<q>` tag.’, ‘The `<q>` tag is specifically designed for inline quotations in HTML.’)”>Quotations are defined in HTML using the `<cite>` tag.</li>
<li class="question8" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(8, 'Quotations are defined in HTML using the `<q>` tag.’, ‘The `<q>` tag is specifically designed for inline quotations in HTML.’)”>Quotations are defined in HTML using the `<q>` tag.</li>
<li class="question8" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(8, 'Quotations are defined in HTML using the `<q>` tag.’, ‘The `<q>` tag is specifically designed for inline quotations in HTML.’)”>Quotations are defined in HTML using the `<blockquote>` tag.</li>
<li class="question8" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(8, 'Quotations are defined in HTML using the `<q>` tag.’, ‘The `<q>` tag is specifically designed for inline quotations in HTML.’)”>Quotations are defined in HTML using the `<quote>` tag.</li>
</ul>
<div id="explanation8" class="explanation" style="display: none; border-radius: 15px; border: 1px solid black; padding: 10px;"></div>
</div>
</br><span class="display-ads-here"></span>
</br><div>
<p>9. How is black color represented in terms of RGB values?</p>
<ul style="list-style-type: none;">
<li class="question9" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(9, '(0, 0, 0)', 'Black color in RGB is represented by the absence of light, which is (0, 0, 0).')">(255, 0, 0)</li>
<li class="question9" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(9, '(0, 0, 0)', 'Black color in RGB is represented by the absence of light, which is (0, 0, 0).')">(0, 0, 0)</li>
<li class="question9" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(9, '(0, 0, 0)', 'Black color in RGB is represented by the absence of light, which is (0, 0, 0).')">(128, 128, 128)</li>
<li class="question9" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(9, '(0, 0, 0)', 'Black color in RGB is represented by the absence of light, which is (0, 0, 0).')">(255, 255, 255)</li>
</ul>
<div id="explanation9" class="explanation" style="display: none; border-radius: 15px; border: 1px solid black; padding: 10px;"></div>
</div>
</br><div>
<p>10. What is the correct syntax to write an HTML comment?</p>
<ul style="list-style-type: none;">
<li class="question10" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(10, '<!-- comment -->‘, ‘The correct syntax to write an HTML comment is `<!-- comment -->`, which tells the browser to ignore anything between the comment tags.’)”>/* comment */</li>
<li class="question10" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(10, '<!-- comment -->‘, ‘The correct syntax to write an HTML comment is `<!-- comment -->`, which tells the browser to ignore anything between the comment tags.’)”><!-- comment --></li>
<li class="question10" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(10, '<!-- comment -->‘, ‘The correct syntax to write an HTML comment is `<!-- comment -->`, which tells the browser to ignore anything between the comment tags.’)”>// comment //</li>
<li class="question10" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(10, '<!-- comment -->‘, ‘The correct syntax to write an HTML comment is `<!-- comment -->`, which tells the browser to ignore anything between the comment tags.’)”><! comment !></li>
</ul>
<div id="explanation10" class="explanation" style="display: none; border-radius: 15px; border: 1px solid black; padding: 10px;"></div>
</div>
</br><div>
<p>11. What is the purpose of the `<br>` tag?</p>
<ul style="list-style-type: none;">
<li class="question11" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(11, 'The `<br>` tag is used to add a line break to the page.’, ‘The `<br>` tag is specifically used to insert a line break, allowing text to continue on a new line without creating a new paragraph.’)”>The `<br>` tag is used to add a line break to the page.</li>
<li class="question11" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(11, 'The `<br>` tag is used to add a line break to the page.’, ‘The `<br>` tag is specifically used to insert a line break, allowing text to continue on a new line without creating a new paragraph.’)”>The `<br>` tag is used to highlight text on the page.</li>
<li class="question11" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(11, 'The `<br>` tag is used to add a line break to the page.’, ‘The `<br>` tag is specifically used to insert a line break, allowing text to continue on a new line without creating a new paragraph.’)”>The `<br>` tag is used to insert images into the webpage.</li>
<li class="question11" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(11, 'The `<br>` tag is used to add a line break to the page.’, ‘The `<br>` tag is specifically used to insert a line break, allowing text to continue on a new line without creating a new paragraph.’)”>The `<br>` tag is used to create a new paragraph in HTML.</li>
</ul>
<div id="explanation11" class="explanation" style="display: none; border-radius: 15px; border: 1px solid black; padding: 10px;"></div>
</div>
</br><span class="display-ads-here"></span>
</br><div>
<p>12. What is the purpose of the `<hr>` tag?</p>
<ul style="list-style-type: none;">
<li class="question12" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(12, 'The `<hr>` tag is used to display a horizontal ruler.’, ‘The `<hr>` tag is used to create a thematic break or a horizontal line in the content, visually separating sections.’)”>The `<hr>` tag is used to create a paragraph.</li>
<li class="question12" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(12, 'The `<hr>` tag is used to display a horizontal ruler.’, ‘The `<hr>` tag is used to create a thematic break or a horizontal line in the content, visually separating sections.’)”>The `<hr>` tag is used to display a vertical line.</li>
<li class="question12" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(12, 'The `<hr>` tag is used to display a horizontal ruler.’, ‘The `<hr>` tag is used to create a thematic break or a horizontal line in the content, visually separating sections.’)”>The `<hr>` tag is used to add a page title.</li>
<li class="question12" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(12, 'The `<hr>` tag is used to display a horizontal ruler.’, ‘The `<hr>` tag is used to create a thematic break or a horizontal line in the content, visually separating sections.’)”>The `<hr>` tag is used to display a horizontal ruler.</li>
</ul>
<div id="explanation12" class="explanation" style="display: none; border-radius: 15px; border: 1px solid black; padding: 10px;"></div>
</div>
</br><div>
<p>13. Which HTML tag is used to render text in italics?</p>
<ul style="list-style-type: none;">
<li class="question13" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(13, '<i>‘, ‘The `<i>` tag is used to render text in italics.’)”><strong></li>
<li class="question13" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(13, '<i>‘, ‘The `<i>` tag is used to render text in italics.’)”><b></li>
<li class="question13" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(13, '<i>‘, ‘The `<i>` tag is used to render text in italics.’)”><i></li>
<li class="question13" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(13, '<i>‘, ‘The `<i>` tag is used to render text in italics.’)”><u></li>
</ul>
<div id="explanation13" class="explanation" style="display: none; border-radius: 15px; border: 1px solid black; padding: 10px;"></div>
</div>
</br><div>
<p>14. Which HTML tag is used to render text in bold?</p>
<ul style="list-style-type: none;">
<li class="question14" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(14, '`<b>`’, ‘The `<b>` tag is used to render text in bold in HTML.’)”>`<b>`</li>
<li class="question14" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(14, '`<b>`’, ‘The `<b>` tag is used to render text in bold in HTML.’)”>`<p>`</li>
<li class="question14" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(14, '`<b>`’, ‘The `<b>` tag is used to render text in bold in HTML.’)”>`<strong>`</li>
<li class="question14" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(14, '`<b>`’, ‘The `<b>` tag is used to render text in bold in HTML.’)”>`<i>`</li>
</ul>
<div id="explanation14" class="explanation" style="display: none; border-radius: 15px; border: 1px solid black; padding: 10px;"></div>
</div>
</br><span class="display-ads-here"></span>
</br><div>
<p>15. What is the default value of the BORDER attribute?</p>
<ul style="list-style-type: none;">
<li class="question15" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(15, '0', 'The default value of the BORDER attribute in HTML is 0, which means no border will be displayed.')">0</li>
<li class="question15" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(15, '0', 'The default value of the BORDER attribute in HTML is 0, which means no border will be displayed.')">10</li>
<li class="question15" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(15, '0', 'The default value of the BORDER attribute in HTML is 0, which means no border will be displayed.')">5</li>
<li class="question15" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(15, '0', 'The default value of the BORDER attribute in HTML is 0, which means no border will be displayed.')">1</li>
</ul>
<div id="explanation15" class="explanation" style="display: none; border-radius: 15px; border: 1px solid black; padding: 10px;"></div>
</div>
</br><div>
<p>16. How to create an ordered list in HTML?</p>
<ul style="list-style-type: none;">
<li class="question16" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(16, 'An ordered list is created using the `<ol>` tag.’, ‘The `<ol>` tag defines an ordered list in HTML, which is used for creating numbered lists.’)”>An ordered list is created using the `<ul>` tag.</li>
<li class="question16" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(16, 'An ordered list is created using the `<ol>` tag.’, ‘The `<ol>` tag defines an ordered list in HTML, which is used for creating numbered lists.’)”>An ordered list is created using the `<table>` tag.</li>
<li class="question16" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(16, 'An ordered list is created using the `<ol>` tag.’, ‘The `<ol>` tag defines an ordered list in HTML, which is used for creating numbered lists.’)”>An ordered list is created using the `<li>` tag.</li>
<li class="question16" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(16, 'An ordered list is created using the `<ol>` tag.’, ‘The `<ol>` tag defines an ordered list in HTML, which is used for creating numbered lists.’)”>An ordered list is created using the `<ol>` tag.</li>
</ul>
<div id="explanation16" class="explanation" style="display: none; border-radius: 15px; border: 1px solid black; padding: 10px;"></div>
</div>
</br><div>
<p>17. How to create an unordered list in HTML?</p>
<ul style="list-style-type: none;">
<li class="question17" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(17, 'An unordered list is created using the `<ul>` tag.’, ‘An unordered list in HTML is used to create a list of items that do not have a specific order, and it is created using the `<ul>` tag.’)”>An unordered list is created using the `<ul>` tag.</li>
<li class="question17" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(17, 'An unordered list is created using the `<ul>` tag.’, ‘An unordered list in HTML is used to create a list of items that do not have a specific order, and it is created using the `<ul>` tag.’)”>An unordered list is created using the `<ol>` tag.</li>
<li class="question17" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(17, 'An unordered list is created using the `<ul>` tag.’, ‘An unordered list in HTML is used to create a list of items that do not have a specific order, and it is created using the `<ul>` tag.’)”>An unordered list is created using the `<li>` tag.</li>
<li class="question17" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(17, 'An unordered list is created using the `<ul>` tag.’, ‘An unordered list in HTML is used to create a list of items that do not have a specific order, and it is created using the `<ul>` tag.’)”>An unordered list is created using the `<list>` tag.</li>
</ul>
<div id="explanation17" class="explanation" style="display: none; border-radius: 15px; border: 1px solid black; padding: 10px;"></div>
</div>
</br><span class="display-ads-here"></span>
</br><div>
<p>18. How to display preformatted text in HTML?</p>
<ul style="list-style-type: none;">
<li class="question18" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(18, '<pre>‘, ‘The `<pre>` tag is used in HTML to display preformatted text, preserving whitespace and line breaks.')"><text></li>
<li class="question18" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(18, '<pre>', 'The `<pre>` tag is used in HTML to display preformatted text, preserving whitespace and line breaks.')"><pre></li>
<li class="question18" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(18, '<pre>', 'The `<pre>` tag is used in HTML to display preformatted text, preserving whitespace and line breaks.')"><code></li>
<li class="question18" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(18, '<pre>', 'The `<pre>` tag is used in HTML to display preformatted text, preserving whitespace and line breaks.')"><format></li>
</ul>
<div id="explanation18" class="explanation" style="display: none; border-radius: 15px; border: 1px solid black; padding: 10px;"></div>
</div>
</br><div>
<p>19. How to set a font for a whole page in HTML?</p>
<ul style="list-style-type: none;">
<li class="question19" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(19, 'A font for a whole page is set using the `<style>` tag or an external CSS file.', 'A font for a whole page is commonly set by declaring styles using the `<style>` tag within the `<head>` section or by linking to an external CSS file.')">A font for a whole page is set using the `<font>` tag within body tags.</li>
<li class="question19" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(19, 'A font for a whole page is set using the `<style>` tag or an external CSS file.', 'A font for a whole page is commonly set by declaring styles using the `<style>` tag within the `<head>` section or by linking to an external CSS file.')">A font for a whole page is set using the `<header>` tag only.</li>
<li class="question19" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(19, 'A font for a whole page is set using the `<style>` tag or an external CSS file.', 'A font for a whole page is commonly set by declaring styles using the `<style>` tag within the `<head>` section or by linking to an external CSS file.')">A font for a whole page is set using the `<script>` tag inside the HTML.</li>
<li class="question19" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(19, 'A font for a whole page is set using the `<style>` tag or an external CSS file.', 'A font for a whole page is commonly set by declaring styles using the `<style>` tag within the `<head>` section or by linking to an external CSS file.')">A font for a whole page is set using the `<style>` tag or an external CSS file.</li>
</ul>
<div id="explanation19" class="explanation" style="display: none; border-radius: 15px; border: 1px solid black; padding: 10px;"></div>
</div>
</br><div>
<p>20. What is the default extension for an HTML file?</p>
<ul style="list-style-type: none;">
<li class="question20" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(20, '.html', 'The default extension for an HTML file is .html, indicating that the file contains HTML code.')">.htm</li>
<li class="question20" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(20, '.html', 'The default extension for an HTML file is .html, indicating that the file contains HTML code.')">.xml</li>
<li class="question20" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(20, '.html', 'The default extension for an HTML file is .html, indicating that the file contains HTML code.')">.html</li>
<li class="question20" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(20, '.html', 'The default extension for an HTML file is .html, indicating that the file contains HTML code.')">.txt</li>
</ul>
<div id="explanation20" class="explanation" style="display: none; border-radius: 15px; border: 1px solid black; padding: 10px;"></div>
</div>
</br><span class="display-ads-here"></span>
</br><div>
<p>21. If a background image is smaller than the screen on which it is being displayed, what will occur on the webpage?</p>
<ul style="list-style-type: none;">
<li class="question21" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(21, 'The background image will be repeated to cover the entire screen.', 'If a background image is smaller than the screen, it will repeat (tile) to fill the space.')">The background image will disappear completely.</li>
<li class="question21" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(21, 'The background image will be repeated to cover the entire screen.', 'If a background image is smaller than the screen, it will repeat (tile) to fill the space.')">The background image will be stretched to fit the screen.</li>
<li class="question21" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(21, 'The background image will be repeated to cover the entire screen.', 'If a background image is smaller than the screen, it will repeat (tile) to fill the space.')">The background image will be repeated to cover the entire screen.</li>
<li class="question21" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(21, 'The background image will be repeated to cover the entire screen.', 'If a background image is smaller than the screen, it will repeat (tile) to fill the space.')">The background image will display as a fixed position.</li>
</ul>
<div id="explanation21" class="explanation" style="display: none; border-radius: 15px; border: 1px solid black; padding: 10px;"></div>
</div>
</br><div>
<p>22. The CSS inside HTML elements used alongside the style attribute is called?</p>
<ul style="list-style-type: none;">
<li class="question22" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(22, 'Inline styles', 'Inline styles are applied directly within HTML elements using the style attribute.')">Internal styles</li>
<li class="question22" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(22, 'Inline styles', 'Inline styles are applied directly within HTML elements using the style attribute.')">External styles</li>
<li class="question22" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(22, 'Inline styles', 'Inline styles are applied directly within HTML elements using the style attribute.')">Inline styles</li>
<li class="question22" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(22, 'Inline styles', 'Inline styles are applied directly within HTML elements using the style attribute.')">Block styles</li>
</ul>
<div id="explanation22" class="explanation" style="display: none; border-radius: 15px; border: 1px solid black; padding: 10px;"></div>
</div>
</br><div>
<p>23. What is the purpose of the `<a>` tag?</p>
<ul style="list-style-type: none;">
<li class="question23" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(23, 'The `<a>` tag defines a hyperlink.', 'The `<a>` tag is used to create links to other webpages or resources.')">The `<a>` tag defines a hyperlink.</li>
<li class="question23" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(23, 'The `<a>` tag defines a hyperlink.', 'The `<a>` tag is used to create links to other webpages or resources.')">The `<a>` tag adds a style to text.</li>
<li class="question23" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(23, 'The `<a>` tag defines a hyperlink.', 'The `<a>` tag is used to create links to other webpages or resources.')">The `<a>` tag creates a table.</li>
<li class="question23" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(23, 'The `<a>` tag defines a hyperlink.', 'The `<a>` tag is used to create links to other webpages or resources.')">The `<a>` tag displays an image.</li>
</ul>
<div id="explanation23" class="explanation" style="display: none; border-radius: 15px; border: 1px solid black; padding: 10px;"></div>
</div>
</br><span class="display-ads-here"></span>
</br><div>
<p>24. Which attribute is used to create a link that opens in a new window tab?</p>
<ul style="list-style-type: none;">
<li class="question24" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(24, 'target', 'The `target` attribute with the value `_blank` is used to create a link that opens in a new window or tab.')">rel</li>
<li class="question24" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(24, 'target', 'The `target` attribute with the value `_blank` is used to create a link that opens in a new window or tab.')">src</li>
<li class="question24" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(24, 'target', 'The `target` attribute with the value `_blank` is used to create a link that opens in a new window or tab.')">target</li>
<li class="question24" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(24, 'target', 'The `target` attribute with the value `_blank` is used to create a link that opens in a new window or tab.')">href</li>
</ul>
<div id="explanation24" class="explanation" style="display: none; border-radius: 15px; border: 1px solid black; padding: 10px;"></div>
</div>
</br><div>
<p>25. Which HTML tag is used to convert plain text into italic format?</p>
<ul style="list-style-type: none;">
<li class="question25" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(25, '<i>', 'The `<i>` tag is used to render text in italics.')"><i></li>
<li class="question25" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(25, '<i>', 'The `<i>` tag is used to render text in italics.')"><strong></li>
<li class="question25" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(25, '<i>', 'The `<i>` tag is used to render text in italics.')"><b></li>
<li class="question25" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(25, '<i>', 'The `<i>` tag is used to render text in italics.')"><p></li>
</ul>
<div id="explanation25" class="explanation" style="display: none; border-radius: 15px; border: 1px solid black; padding: 10px;"></div>
</div>
</br><div>
<p>26. Which HTML tag is used to convert plain text into bold format?</p>
<ul style="list-style-type: none;">
<li class="question26" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(26, '`<b>`', 'The `<b>` tag is used to convert plain text into bold format in HTML.')">`<u>`</li>
<li class="question26" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(26, '`<b>`', 'The `<b>` tag is used to convert plain text into bold format in HTML.')">`<strong>`</li>
<li class="question26" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(26, '`<b>`', 'The `<b>` tag is used to convert plain text into bold format in HTML.')">`<b>`</li>
<li class="question26" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(26, '`<b>`', 'The `<b>` tag is used to convert plain text into bold format in HTML.')">`<i>`</li>
</ul>
<div id="explanation26" class="explanation" style="display: none; border-radius: 15px; border: 1px solid black; padding: 10px;"></div>
</div>
</br><span class="display-ads-here"></span>
</br><div>
<p>27. Which HTML tag is used to show text that has been deleted?</p>
<ul style="list-style-type: none;">
<li class="question27" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(27, '`<del>`', 'The `<del>` tag is used in HTML to show text that has been deleted.')">`<span>`</li>
<li class="question27" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(27, '`<del>`', 'The `<del>` tag is used in HTML to show text that has been deleted.')">`<sup>`</li>
<li class="question27" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(27, '`<del>`', 'The `<del>` tag is used in HTML to show text that has been deleted.')">`<del>`</li>
<li class="question27" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(27, '`<del>`', 'The `<del>` tag is used in HTML to show text that has been deleted.')">`<sub>`</li>
</ul>
<div id="explanation27" class="explanation" style="display: none; border-radius: 15px; border: 1px solid black; padding: 10px;"></div>
</div>
</br><div>
<p>28. Which HTML tag is used to show text that has been inserted?</p>
<ul style="list-style-type: none;">
<li class="question28" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(28, '`<ins>`', 'The `<ins>` tag is used in HTML to specify text that has been inserted into a document.')">`<new>`</li>
<li class="question28" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(28, '`<ins>`', 'The `<ins>` tag is used in HTML to specify text that has been inserted into a document.')">`<insert>`</li>
<li class="question28" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(28, '`<ins>`', 'The `<ins>` tag is used in HTML to specify text that has been inserted into a document.')">`<add>`</li>
<li class="question28" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(28, '`<ins>`', 'The `<ins>` tag is used in HTML to specify text that has been inserted into a document.')">`<ins>`</li>
</ul>
<div id="explanation28" class="explanation" style="display: none; border-radius: 15px; border: 1px solid black; padding: 10px;"></div>
</div>
</br><div>
<p>29. Which HTML tag is used to show text that has been emphasized?</p>
<ul style="list-style-type: none;">
<li class="question29" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(29, '`<em>`', 'The `<em>` tag is used to show text that has been emphasized.')">`<strong>`</li>
<li class="question29" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(29, '`<em>`', 'The `<em>` tag is used to show text that has been emphasized.')">`<i>`</li>
<li class="question29" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(29, '`<em>`', 'The `<em>` tag is used to show text that has been emphasized.')">`<em>`</li>
<li class="question29" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(29, '`<em>`', 'The `<em>` tag is used to show text that has been emphasized.')">`<b>`</li>
</ul>
<div id="explanation29" class="explanation" style="display: none; border-radius: 15px; border: 1px solid black; padding: 10px;"></div>
</div>
</br><span class="display-ads-here"></span>
</br><div>
<p>30. Which HTML tag is used to show text that has been strongly emphasized?</p>
<ul style="list-style-type: none;">
<li class="question30" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(30, '`<strong>`', 'The `<strong>` tag is used to show text that has been strongly emphasized.')">`<bold>`</li>
<li class="question30" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(30, '`<strong>`', 'The `<strong>` tag is used to show text that has been strongly emphasized.')">`<strong>`</li>
<li class="question30" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(30, '`<strong>`', 'The `<strong>` tag is used to show text that has been strongly emphasized.')">`<highlight>`</li>
<li class="question30" style="padding: 5px; cursor: pointer; border: 1px solid black; margin-bottom:3px; border-radius:10px;" onclick="checkAnswer(30, '`<strong>`', 'The `<strong>` tag is used to show text that has been strongly emphasized.')">`<emphasize>`</li>
</ul>
<div id="explanation30" class="explanation" style="display: none; border-radius: 15px; border: 1px solid black; padding: 10px;"></div>
</div>
</br></div>
<p><img alt='Quiz Successfully Completed!' src='/wp-content/uploads/HTML-Fundamentals-2.webp'></img></p>
<h2><span class="ez-toc-section" id="quiz-successfully-completed"></span>Quiz Successfully Completed!<span class="ez-toc-section-end"></span></h2>
<p>Congratulations on finishing the quiz on HTML Fundamentals! This exercise was an excellent way to assess your understanding of key concepts like elements, attributes, and the structure of HTML documents. It’s great to see how much you enjoyed the process. Engaging with these fundamental topics helps to solidify your web development skills.</p>
<p>Throughout the quiz, you likely reinforced your knowledge about the role of HTML in creating web pages. You might have discovered new information about semantic elements and accessibility. These topics are essential for making your websites not only functional but also user-friendly and inclusive.</p>
<p>We invite you to explore the next section on this page, which dives deeper into HTML Fundamentals. This section offers valuable resources and explanations that can expand your knowledge. Whether you’re a beginner or looking to refresh your skills, there’s always more to learn in the world of web development!</p><br/><p><img alt='HTML Fundamentals' src='/wp-content/uploads/HTML-Fundamentals-3.webp'></img></p>
<h2><span class="ez-toc-section" id="html-fundamentals"></span>HTML Fundamentals<span class="ez-toc-section-end"></span></h2>
<p><h3><span class="ez-toc-section" id="understanding-html"></span>Understanding HTML<span class="ez-toc-section-end"></span></h3>
<p>HTML, or HyperText Markup Language, is the standard language used to create web pages. It structures content on the internet by using tags and elements to define headings, paragraphs, images, links, and more. HTML is essential for building any website, as it provides the backbone for web content display. Every webpage is fundamentally an HTML document, and without it, browsers would not know how to render content for users.</p>
<h3><span class="ez-toc-section" id="html-elements-and-tags"></span>HTML Elements and Tags<span class="ez-toc-section-end"></span></h3>
<p>HTML elements consist of tags that define the structure and content of a webpage. An element typically has an opening tag, content, and a closing tag. For example, the <p> tag denotes a paragraph. Tags can be nested within each other to create a hierarchy of content. Understanding the purpose of each tag is vital for effective web design, as the correct use influences the layout and functionality of a page.</p>
<h3><span class="ez-toc-section" id="attributes-in-html"></span>Attributes in HTML<span class="ez-toc-section-end"></span></h3>
<p>Attributes in HTML provide additional information about an element. They are placed within the opening tag and typically consist of a name-value pair. For instance, the <a> tag for links often includes an href attribute to define the destination URL. Attributes enhance the functionality of elements, allowing developers to control aspects like styling, behavior, and even accessibility, contributing to a richer user experience.</p>
<h3><span class="ez-toc-section" id="semantic-html"></span>Semantic HTML<span class="ez-toc-section-end"></span></h3>
<p>Semantic HTML refers to the use of HTML markup that conveys meaning about the content. Unlike generic tags, semantic elements like <header>, <footer>, <article>, and <section> describe the purpose and structure of the content. This practice improves search engine optimization (SEO) and enhances accessibility for assistive technologies. Using semantic HTML ensures a clearer understanding of the web page's layout and improves user navigation.</p>
<h3><span class="ez-toc-section" id="html-forms-and-input-elements"></span>HTML Forms and Input Elements<span class="ez-toc-section-end"></span></h3>
<p>HTML forms are crucial for user interaction on websites, allowing users to submit data. A form comprises various input elements like text fields, checkboxes, radio buttons, and submit buttons, defined by the <form> tag. Each input element has attributes for customization, such as type, name, and value. Understanding forms is essential for creating interactive applications, as they facilitate user engagement and data collection.</p>
<h3><span class="ez-toc-section" id="what-is-html"></span>What is HTML?<span class="ez-toc-section-end"></span></h3>
<p>HTML, or Hypertext Markup Language, is the standard markup language used to create web pages. It structures the content on the web, allowing text, images, links, and other elements to be displayed and arranged. HTML uses tags to define these elements, ensuring browsers render them correctly.</p>
<h3><span class="ez-toc-section" id="how-does-html-work"></span>How does HTML work?<span class="ez-toc-section-end"></span></h3>
<p>HTML works by using a system of tags that provide structure and meaning to content. Each webpage is created with HTML code that instructs the browser on how to display text, images, and multimedia. Tags are enclosed in angle brackets (e.g., <tagname>content</tagname>), which the browser interprets to render the page as intended.</p>
<h3><span class="ez-toc-section" id="where-is-html-used"></span>Where is HTML used?<span class="ez-toc-section-end"></span></h3>
<p>HTML is used in virtually every website on the internet. It serves as the backbone for web development, providing the foundation for content delivery. HTML is integrated into various platforms, content management systems, and web applications, making it essential for any online presence.</p>
<h3><span class="ez-toc-section" id="when-was-html-first-developed"></span>When was HTML first developed?<span class="ez-toc-section-end"></span></h3>
<p>HTML was first developed by Tim Berners-Lee between 1989 and 1991. The initial version was designed to facilitate the sharing of scientific documents through the internet. Since then, HTML has undergone several revisions, with HTML5 being the latest major version standardized in 2014.</p>
<h3><span class="ez-toc-section" id="who-created-html"></span>Who created HTML?<span class="ez-toc-section-end"></span></h3>
<p>HTML was created by Tim Berners-Lee, a British computer scientist. He proposed HTML as part of his broader vision for the World Wide Web while working at CERN. His development of HTML laid the groundwork for web content and structure, fundamentally shaping how information is shared online.</p>
<script>
function updateFinalScore() {
var finalScoreSpan = document.getElementById('finalScore');
var correctAnswers = document.querySelectorAll('.correct.selected-answer').length;
var totalQuestions = document.querySelectorAll('.question').length;
finalScoreSpan.textContent = correctAnswers + ' / ' + totalQuestions;
}
</script>
<div style="clear:both; margin-top:0em; margin-bottom:1em;"><a href="/ai-integration-programming-quiz/" target="_self" rel="dofollow" class="u7de1998c469bede97c728b4324076d7c"><!-- INLINE RELATED POSTS 1/2 //--><style> .u7de1998c469bede97c728b4324076d7c , .u7de1998c469bede97c728b4324076d7c .postImageUrl , .u7de1998c469bede97c728b4324076d7c .centered-text-area { min-height: 80px; position: relative; } .u7de1998c469bede97c728b4324076d7c , .u7de1998c469bede97c728b4324076d7c:hover , .u7de1998c469bede97c728b4324076d7c:visited , .u7de1998c469bede97c728b4324076d7c:active { border:0!important; } .u7de1998c469bede97c728b4324076d7c .clearfix:after { content: ""; display: table; clear: both; } .u7de1998c469bede97c728b4324076d7c { display: block; transition: background-color 250ms; webkit-transition: background-color 250ms; width: 100%; opacity: 1; transition: opacity 250ms; webkit-transition: opacity 250ms; background-color: #E74C3C; } .u7de1998c469bede97c728b4324076d7c:active , .u7de1998c469bede97c728b4324076d7c:hover { opacity: 1; transition: opacity 250ms; webkit-transition: opacity 250ms; background-color: #E74C3C; } .u7de1998c469bede97c728b4324076d7c .centered-text-area { width: 100%; position: relative; } .u7de1998c469bede97c728b4324076d7c .ctaText { border-bottom: 0 solid #fff; color: #FFFFFF; font-size: 16px; font-weight: bold; margin: 0; padding: 0; text-decoration: underline; } .u7de1998c469bede97c728b4324076d7c .postTitle { color: #FFFFFF; font-size: 16px; font-weight: 600; margin: 0; padding: 0; width: 100%; } .u7de1998c469bede97c728b4324076d7c .ctaButton { background-color: #C0392B!important; color: #FFFFFF; border: none; border-radius: 3px; box-shadow: none; font-size: 14px; font-weight: bold; line-height: 26px; moz-border-radius: 3px; text-align: center; text-decoration: none; text-shadow: none; width: 80px; min-height: 80px; background: url(/wp-content/plugins/intelly-related-posts/assets/images/simple-arrow.png)no-repeat; position: absolute; right: 0; top: 0; } .u7de1998c469bede97c728b4324076d7c:hover .ctaButton { background-color: #C0392B!important; } .u7de1998c469bede97c728b4324076d7c .centered-text { display: table; height: 80px; padding-left: 18px; top: 0; } .u7de1998c469bede97c728b4324076d7c .u7de1998c469bede97c728b4324076d7c-content { display: table-cell; margin: 0; padding: 0; padding-right: 108px; position: relative; vertical-align: middle; width: 100%; } .u7de1998c469bede97c728b4324076d7c:after { content: ""; display: block; clear: both; } </style><div class="centered-text-area"><div class="centered-text" style="float: left;"><div class="u7de1998c469bede97c728b4324076d7c-content"><span class="ctaText">See also</span> <span class="postTitle">AI Integration Programming Quiz</span></div></div></div><div class="ctaButton"></div></a></div></div>
<section class="post-nav" role="navigation">
<h2 class="screen-reader-text">Post navigation</h2>
<div class="nav-previous"><h6 class="nav-title">Previous Post</h6><a href="/html5-and-css3-basics-quiz/" rel="prev"><div class="nav-content"><img width="75" height="75" src="/wp-content/uploads/Featured-image-HTML5-and-CSS3-Basics-Quiz-150x150.webp" class="attachment-75x75 size-75x75 wp-post-image" alt="HTML5 and CSS3 Basics Quiz" itemprop="image" decoding="async" /> <span>HTML5 and CSS3 Basics Quiz</span></div></a></div><div class="nav-next"><h6 class="nav-title">Next Post</h6><a href="/html-programming-basics-quiz/" rel="next"><div class="nav-content"><span>HTML Programming Basics Quiz</span> <img width="75" height="75" src="/wp-content/uploads/Featured-image-HTML-Programming-Basics-Quiz-150x150.webp" class="attachment-75x75 size-75x75 wp-post-image" alt="HTML Programming Basics Quiz" itemprop="image" decoding="async" /></div></a></div>
</section>
</article><!-- #post-513 -->
<a href="#" id="bloglo-comments-toggle" class="bloglo-btn btn-large btn-fw btn-left-icon">
<svg class="bloglo-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><path d="M512 160h-96V64c0-35.3-28.7-64-64-64H64C28.7 0 0 28.7 0 64v160c0 35.3 28.7 64 64 64h32v52c0 7.1 5.8 12 12 12 2.4 0 4.9-.7 7.1-2.4L224 288h128c35.3 0 64-28.7 64-64v-32h96c17.6 0 32 14.4 32 32v160c0 17.6-14.4 32-32 32h-64v49.6l-80.2-45.4-7.3-4.2H256c-17.6 0-32-14.4-32-32v-96l-32 18.1V384c0 35.3 28.7 64 64 64h96l108.9 61.6c2.2 1.6 4.7 2.4 7.1 2.4 6.2 0 12-4.9 12-12v-52h32c35.3 0 64-28.7 64-64V224c0-35.3-28.7-64-64-64zm-128 64c0 17.6-14.4 32-32 32H215.6l-7.3 4.2-80.3 45.4V256H64c-17.6 0-32-14.4-32-32V64c0-17.6 14.4-32 32-32h288c17.6 0 32 14.4 32 32v160z" /></svg> <span>Leave a Comment</span>
</a>
<section id="comments" class="comments-area">
<div class="comments-title-wrapper center-text">
<h3 class="comments-title">
Comments </h3><!-- END .comments-title -->
<p class="no-comments">No comments yet. Why don’t you start the discussion?</p>
</div>
<ol class="comment-list">
</ol>
<div id="respond" class="comment-respond">
<h3 id="reply-title" class="comment-reply-title">Leave a Reply <small><a rel="nofollow" id="cancel-comment-reply-link" href="/html-fundamentals-quiz/#respond" style="display:none;">Cancel reply</a></small></h3><form action="/wp-comments-post.php" method="post" id="commentform" class="comment-form"><p class="comment-notes"><span id="email-notes">Your email address will not be published.</span> <span class="required-field-message">Required fields are marked <span class="required">*</span></span></p><p class="comment-textarea"><textarea name="comment" id="comment" cols="44" rows="8" class="textarea-comment" placeholder="Write a comment…" required="required"></textarea></p><p class="comment-form-author"><label for="author">Name <span class="required">*</span></label> <input id="author" name="author" type="text" value="" size="30" maxlength="245" autocomplete="name" required="required" /></p>
<p class="comment-form-email"><label for="email">Email <span class="required">*</span></label> <input id="email" name="email" type="text" value="" size="30" maxlength="100" aria-describedby="email-notes" autocomplete="email" required="required" /></p>
<p class="comment-form-url"><label for="url">Website</label> <input id="url" name="url" type="text" value="" size="30" maxlength="200" autocomplete="url" /></p>
<p class="comment-form-cookies-consent"><input id="wp-comment-cookies-consent" name="wp-comment-cookies-consent" type="checkbox" value="yes" /> <label for="wp-comment-cookies-consent">Save my name, email, and website in this browser for the next time I comment.</label></p>
<p class="form-submit"><span class="bloglo-submit-form-button"><input name="submit" type="submit" id="comment-submit" class="bloglo-btn primary-button" value="Post Comment" /></span> <input type='hidden' name='comment_post_ID' value='513' id='comment_post_ID' />
<input type='hidden' name='comment_parent' id='comment_parent' value='0' />
</p></form> </div><!-- #respond -->
</section><!-- #comments -->
</main><!-- #content .site-content -->
</div><!-- #primary .content-area -->
<aside id="secondary" class="widget-area bloglo-sidebar-container" itemtype="http://schema.org/WPSideBar" itemscope="itemscope" role="complementary">
<div class="bloglo-sidebar-inner">
<div id="block-6" class="bloglo-sidebar-widget bloglo-widget bloglo-entry widget widget_block">
<div class="wp-block-group"><div class="wp-block-group__inner-container is-layout-flow wp-block-group-is-layout-flow">
<h2 class="wp-block-heading">Categories</h2>
<ul class="wp-block-categories-list wp-block-categories"> <li class="cat-item cat-item-3"><a href="/quiz-time/">Quiz Time</a>
</li>
</ul></div></div>
</div>
</div>
</aside><!--#secondary .widget-area -->
</div><!-- END .bloglo-container -->
<div id="pyml" >
<div class="bloglo-pyml-slider">
<div class="bloglo-pyml-container bloglo-container">
<div class="bloglo-flex-row">
<div class="col-xs-12">
<div class="pyml-slider-items">
<div class="h4 widget-title">
<span>Post You Might Like</span>
</div>
<div class="bloglo-flex-row gy-4">
<div class="col-md-4 col-sm-6 col-xs-12">
<div class="pyml-slide-item">
<div class="pyml-slider-backgrounds">
<a href="/time-series-analysis-programming-quiz/">
<div class="pyml-slide-bg"> <img width="1024" height="538" src="/wp-content/uploads/Featured-image-Time-Series-Analysis-Programming-Quiz-1024x538.webp" class="attachment-large size-large wp-post-image" alt="" loading="lazy" /> </div>
</a>
<div class="post-category">
<span class="cat-links"><span class="screen-reader-text">Posted in</span><span><a href="/quiz-time/" rel="category">Quiz Time</a></span></span> </div>
</div><!-- END .pyml-slider-items -->
<div class="slide-inner">
<h6><a href="/time-series-analysis-programming-quiz/">Time Series Analysis Programming Quiz</a></h6>
<div class="entry-meta">
<div class="entry-meta-elements">
<span class="post-author">
<span class="posted-by vcard author">
<span class="screen-reader-text">Posted by</span>
<span>
By <a class="url fn n" title="View all posts by Liam Caldwell" href="/author/admin/" rel="author">
<span class="author-name">
Liam Caldwell </span>
</a>
</span>
</span>
</span>
<span class="posted-on">21/02/2025</span> </div>
</div><!-- END .entry-meta -->
</div><!-- END .slide-inner -->
</div><!-- END .pyml-slide-item -->
</div><!-- END .pyml-slider-item-wrapper -->
<div class="col-md-4 col-sm-6 col-xs-12">
<div class="pyml-slide-item">
<div class="pyml-slider-backgrounds">
<a href="/testing-and-debugging-javascript-programming-quiz/">
<div class="pyml-slide-bg"> <img width="1024" height="538" src="/wp-content/uploads/Featured-image-Testing-and-Debugging-JavaScript-Programming-Quiz-1024x538.webp" class="attachment-large size-large wp-post-image" alt="" loading="lazy" /> </div>
</a>
<div class="post-category">
<span class="cat-links"><span class="screen-reader-text">Posted in</span><span><a href="/quiz-time/" rel="category">Quiz Time</a></span></span> </div>
</div><!-- END .pyml-slider-items -->
<div class="slide-inner">
<h6><a href="/testing-and-debugging-javascript-programming-quiz/">Testing and Debugging JavaScript Programming Quiz</a></h6>
<div class="entry-meta">
<div class="entry-meta-elements">
<span class="post-author">
<span class="posted-by vcard author">
<span class="screen-reader-text">Posted by</span>
<span>
By <a class="url fn n" title="View all posts by Liam Caldwell" href="/author/admin/" rel="author">
<span class="author-name">
Liam Caldwell </span>
</a>
</span>
</span>
</span>
<span class="posted-on">21/02/2025</span> </div>
</div><!-- END .entry-meta -->
</div><!-- END .slide-inner -->
</div><!-- END .pyml-slide-item -->
</div><!-- END .pyml-slider-item-wrapper -->
<div class="col-md-4 col-sm-6 col-xs-12">
<div class="pyml-slide-item">
<div class="pyml-slider-backgrounds">
<a href="/test-driven-development-methodologies-quiz/">
<div class="pyml-slide-bg"> <img width="1024" height="538" src="/wp-content/uploads/Featured-image-Test-Driven-Development-Methodologies-Quiz-1024x538.webp" class="attachment-large size-large wp-post-image" alt="" loading="lazy" /> </div>
</a>
<div class="post-category">
<span class="cat-links"><span class="screen-reader-text">Posted in</span><span><a href="/quiz-time/" rel="category">Quiz Time</a></span></span> </div>
</div><!-- END .pyml-slider-items -->
<div class="slide-inner">
<h6><a href="/test-driven-development-methodologies-quiz/">Test-Driven Development Methodologies Quiz</a></h6>
<div class="entry-meta">
<div class="entry-meta-elements">
<span class="post-author">
<span class="posted-by vcard author">
<span class="screen-reader-text">Posted by</span>
<span>
By <a class="url fn n" title="View all posts by Liam Caldwell" href="/author/admin/" rel="author">
<span class="author-name">
Liam Caldwell </span>
</a>
</span>
</span>
</span>
<span class="posted-on">21/02/2025</span> </div>
</div><!-- END .entry-meta -->
</div><!-- END .slide-inner -->
</div><!-- END .pyml-slide-item -->
</div><!-- END .pyml-slider-item-wrapper -->
</div>
</div>
</div>
</div><!-- END .pyml-slider-items -->
</div>
</div><!-- END .bloglo-pyml-slider -->
</div><!-- END #pyml -->
</div><!-- #main .site-main -->
<footer id="colophon" class="site-footer" role="contentinfo" itemtype="http://schema.org/WPFooter" itemscope="itemscope">
<div id="bloglo-footer" >
<div class="bloglo-container">
<div class="bloglo-flex-row" id="bloglo-footer-widgets">
<div class="bloglo-footer-column col-xs-12 col-sm-12 stretch-xs col-md-12 center-text">
<div id="block-8" class="bloglo-footer-widget bloglo-widget bloglo-entry widget widget_block widget_text">
<p><a href="/html-sitemap">Sitemap</a><br><a href="/category-sitemap.xml" data-type="link" data-id="/category-sitemap.xml">Categories</a><br><a href="/post-sitemap.xml" data-type="link" data-id="/post-sitemap.xml">Post XML map</a></p>
</div> </div>
</div><!-- END .bloglo-flex-row -->
</div><!-- END .bloglo-container -->
</div><!-- END #bloglo-footer -->
<div id="bloglo-copyright" class="fw-separator">
<div class="bloglo-container">
<div class="bloglo-flex-row">
<div class="col-xs-12 center-xs col-md flex-basis-auto start-md"><div class="bloglo-copyright-widget__text bloglo-copyright-widget bloglo-all"><span>Copyright 2025 — saltedandhung.com.sg.</span></div><!-- END .bloglo-copyright-widget --></div>
<div class="col-xs-12 center-xs col-md flex-basis-auto end-md"></div>
</div><!-- END .bloglo-flex-row -->
</div>
</div><!-- END #bloglo-copyright -->
</footer><!-- #colophon .site-footer -->
</div><!-- END #page -->
<a href="#" id="bloglo-scroll-top" class="bloglo-smooth-scroll" title="Scroll to Top" >
<span class="bloglo-scroll-icon" aria-hidden="true">
<svg class="bloglo-icon top-icon" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32"><path d="M24.958 18.491l-8.008-8.008a1.29 1.29 0 00-1.868 0l-8.008 8.008c-.534.534-.534 1.335 0 1.868s1.335.534 1.868 0l7.074-7.074 7.074 7.074c.267.267.667.4.934.4s.667-.133.934-.4a1.29 1.29 0 000-1.868z" /></svg> <svg class="bloglo-icon" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32"><path d="M24.958 18.491l-8.008-8.008a1.29 1.29 0 00-1.868 0l-8.008 8.008c-.534.534-.534 1.335 0 1.868s1.335.534 1.868 0l7.074-7.074 7.074 7.074c.267.267.667.4.934.4s.667-.133.934-.4a1.29 1.29 0 000-1.868z" /></svg> </span>
<span class="screen-reader-text">Scroll to Top</span>
</a><!-- END #bloglo-scroll-to-top -->
<script id="ez-toc-scroll-scriptjs-js-extra">
var eztoc_smooth_local = {"scroll_offset":"30","add_request_uri":""};
</script>
<script src="/wp-content/plugins/easy-table-of-contents/assets/js/smooth_scroll.min.js?ver=2.0.71" id="ez-toc-scroll-scriptjs-js"></script>
<script src="/wp-content/plugins/easy-table-of-contents/vendor/js-cookie/js.cookie.min.js?ver=2.2.1" id="ez-toc-js-cookie-js"></script>
<script src="/wp-content/plugins/easy-table-of-contents/vendor/sticky-kit/jquery.sticky-kit.min.js?ver=1.9.2" id="ez-toc-jquery-sticky-kit-js"></script>
<script id="ez-toc-js-js-extra">
var ezTOC = {"smooth_scroll":"1","visibility_hide_by_default":"","scroll_offset":"30","fallbackIcon":"<span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #fc6668;color:#fc6668\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #fc6668;color:#fc6668\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span>","chamomile_theme_is_on":""};
</script>
<script src="/wp-content/plugins/easy-table-of-contents/assets/js/front.min.js?ver=2.0.71-1734691460" id="ez-toc-js-js"></script>
<script src="/wp-includes/js/comment-reply.min.js?ver=6.7.1" id="comment-reply-js" async data-wp-strategy="async"></script>
<script src="/wp-includes/js/imagesloaded.min.js?ver=5.0.0" id="imagesloaded-js"></script>
<script id="bloglo-js-extra">
var bloglo_vars = {"ajaxurl":"\/wp-admin\/admin-ajax.php","nonce":"292a8a5637","responsive-breakpoint":"1024","sticky-header":{"enabled":false,"hide_on":[""]},"dark_mode":"","strings":{"comments_toggle_show":"Leave a Comment","comments_toggle_hide":"Hide Comments"}};
</script>
<script src="/wp-content/themes/bloglo/assets/js/bloglo.min.js?ver=1.1.16" id="bloglo-js"></script>
<script src="/wp-content/themes/bloglo/assets/js/vendors/jquery.marquee.min.js?ver=1.1.16" id="bloglo-marquee-js"></script>
<script>
! function() {
var e = -1 < navigator.userAgent.toLowerCase().indexOf("webkit"),
t = -1 < navigator.userAgent.toLowerCase().indexOf("opera"),
n = -1 < navigator.userAgent.toLowerCase().indexOf("msie");
(e || t || n) && document.getElementById && window.addEventListener && window.addEventListener("hashchange", function() {
var e, t = location.hash.substring(1);
/^[A-z0-9_-]+$/.test(t) && (e = document.getElementById(t)) && (/^(?:a|select|input|button|textarea)$/i.test(e.tagName) || (e.tabIndex = -1), e.focus())
}, !1)
}();
</script>
<div class="bloglo-waves-wrapper">
<div class="squares">
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
</div>
<div class="triangles">
<div class="triangle"></div>
<div class="triangle"></div>
<div class="triangle"></div>
<div class="triangle"></div>
<div class="triangle"></div>
</div>
<div class="circles">
<div class="circle"></div>
<div class="circle"></div>
<div class="circle"></div>
<div class="circle"></div>
<div class="circle"></div>
</div>
</div>
</body>
</html>