HTML Links and Navigation Quiz
Want to learn more than this quiz offers you? Have a look at my Frontend web
development courses.
Create an account and save your quiz results
Login and save your results
OR
Question 1/15
How would you display a list of links as a horizontal navigation menu using CSS?
Select your answer
Question 2/15
Which CSS property should be used to ensure that a link changes appearance when it is hovered over?
Select your answer
Question 3/15
Which attribute is used in HTML to specify the URL of the linked page?
Select your answer
Question 4/15
What is a benefit of using a
element over a for navigation links?
Select your answer
Question 6/15
Which of these events is triggered when a user clicks on a link?
Select your answer
Question 7/15
Which of the following link states can be styled using CSS pseudo-classes?
Select your answer
Question 8/15
What does the CSS property
text-indent
do when applied to a hyperlink?
Select your answer
Question 10/15
In which section of the HTML document should the styles for a page be linked?
Select your answer
Question 11/15
Which CSS property would you use to remove the underline from hyperlinks?
Select your answer
Question 12/15
What does an anchor link with only '#' as the href attribute do?
Select your answer
Question 13/15
What is a fragment identifier used for in a URL?
Select your answer
Question 14/15
What is the effect of setting
target="_top"
in a hyperlink?
Select your answer
Question 15/15
Which of the following BEST describes the purpose of a navigation bar?
Select your answer
Your Results
You did not answer any questions correctly.
Your Answers
Question 1/15
😊 Your
answer was correct
🙁 Your
answer was incorrect
How would you display a list of links as a horizontal navigation menu using CSS?
Available answers
Setting
display: inline;
on each link will display them horizontally.
Question 2/15
😊 Your
answer was correct
🙁 Your
answer was incorrect
Which CSS property should be used to ensure that a link changes appearance when it is hovered over?
Available answers
Using the
:hover
pseudo-class allows you to change how a link appears when hovered over.
Question 3/15
😊 Your
answer was correct
🙁 Your
answer was incorrect
Which attribute is used in HTML to specify the URL of the linked page?
Available answers
The
href
attribute specifies the URL of the page the link goes to.
Question 4/15
😊 Your
answer was correct
🙁 Your
answer was incorrect
What is a benefit of using a <pre><code><nav></code></pre> element over a <pre><code><div></code></pre> for navigation links?
Available answers
Using a
element provides semantic meaning to the document structure and can enhance SEO, as search engines identify it as a block of navigation links.
Question 5/15
😊 Your
answer was correct
🙁 Your
answer was incorrect
What does the <pre><code>title</code></pre> attribute do when used in an <pre><code><a></code></pre> tag?
Available answers
The
title
attribute provides a tooltip that appears on hover, giving more information about the link.
Question 6/15
😊 Your
answer was correct
🙁 Your
answer was incorrect
Which of these events is triggered when a user clicks on a link?
Available answers
The
onclick
event is triggered when a user clicks on a link or any other element.
Question 7/15
😊 Your
answer was correct
🙁 Your
answer was incorrect
Which of the following link states can be styled using CSS pseudo-classes?
Available answers
The pseudo-classes
:hover
, :visited
, and :active
can be used to style links in various states.
Question 8/15
😊 Your
answer was correct
🙁 Your
answer was incorrect
What does the CSS property <pre><code>text-indent</code></pre> do when applied to a hyperlink?
Available answers
The
text-indent
property sets the horizontal indent for the first line of the hyperlink's text within its container.
Question 9/15
😊 Your
answer was correct
🙁 Your
answer was incorrect
What is the default value of the <pre><code>target</code></pre> attribute in the <a> element?
Available answers
The default value of the
target
attribute is _self
, which means the link will open in the same window/tab.
Question 10/15
😊 Your
answer was correct
🙁 Your
answer was incorrect
In which section of the HTML document should the styles for a page be linked?
Available answers
CSS should be linked in the header section using the
element.
Question 11/15
😊 Your
answer was correct
🙁 Your
answer was incorrect
Which CSS property would you use to remove the underline from hyperlinks?
Available answers
To remove the underline from hyperlinks, use the CSS property
text-decoration: none;
.
Question 12/15
😊 Your
answer was correct
🙁 Your
answer was incorrect
What does an anchor link with only '#' as the href attribute do?
Available answers
An anchor with
href='#'
serves as a placeholder and does not navigate to any page.
Question 13/15
😊 Your
answer was correct
🙁 Your
answer was incorrect
What is a fragment identifier used for in a URL?
Available answers
A fragment identifier, indicated by a hash
#
followed by a name, specifies a section within a web page to navigate to.
Question 14/15
😊 Your
answer was correct
🙁 Your
answer was incorrect
What is the effect of setting <pre><code>target="_top"</code></pre> in a hyperlink?
Available answers
The
target="_top"
attribute is used to open the link in the full window, exiting any frames.
Question 15/15
😊 Your
answer was correct
🙁 Your
answer was incorrect
Which of the following BEST describes the purpose of a navigation bar?
Available answers
A navigation bar provides a set of links that help users navigate between different sections or pages of a website.
show = false, 4000);"
x-show="show && message" x-transition:enter="transition ease-out duration-300"
x-transition:enter-start="opacity-0 transform translate-y-2" x-transition:enter-end="opacity-100"
x-transition:leave="transition ease-in duration-100" x-transition:leave-start="opacity-100"
x-transition:leave-end="opacity-0 transform translate-y-2" @click.away="show = false"
@keydown.escape.window="show = false" role="alert" aria-live="assertive" aria-labelledby="flashMessageTitle"
aria-describedby="flashMessageDesc"
class="fixed top-0 right-0 mt-8 mr-8 bg-white rounded overflow-hidden shadow-2xl max-w-xl" x-cloak>