Graded A
What is the difference between inline and block elements in HTML?
✔✔Inline elements do not start on a new line and only take up as much width as necessary,
while block elements start on a new line and take up the full width available.
How do you specify the character encoding for an HTML document?
✔✔Character encoding can be specified using the `<meta>` tag within the `<head>` section:
`<meta charset="UTF-8">`.
What does the `data-*` attribute allow in HTML?
✔✔The `data-*` attribute allows you to store custom data directly within HTML elements, which
can be accessed via JavaScript for dynamic functionality.
How can you create an HTML structure that is semantic?
✔✔Semantic HTML is created by using tags that clearly describe their meaning, like
`<header>`, `<nav>`, `<article>`, `<section>`, and `<footer>`, enhancing readability and
accessibility.
1
,What is the purpose of the `<link>` tag in the `<head>` section?
✔✔The `<link>` tag is used to link external resources such as stylesheets to the HTML
document, enabling the application of CSS styles.
How can you create a tooltip that appears when hovering over an element?
✔✔A tooltip can be created using the `title` attribute on any HTML element, which displays a
small popup with text when the user hovers over it.
What does the `<meta name="description">` tag do?
✔✔The `<meta name="description">` tag provides a brief summary of the webpage content,
which can be displayed in search engine results to attract clicks.
How do you implement a form that accepts only email addresses?
✔✔A form that accepts only email addresses can be created using `<input type="email">`,
which enforces proper email format validation upon submission.
What is the function of the `<summary>` tag in a `<details>` element?
✔✔The `<summary>` tag provides a visible heading for the `<details>` element that users can
click to expand and view hidden content.
2
, How can you create an HTML element that is hidden by default but can be toggled to show?
✔✔An element can be hidden by default using the `hidden` attribute or CSS property `display:
none;`, and can be shown with JavaScript or a button click.
What does the `tabindex` attribute do?
✔✔The `tabindex` attribute specifies the tab order of elements when navigating through the page
using the keyboard, enhancing accessibility for users.
How can you embed a Google Maps location into your webpage?
✔✔Google Maps can be embedded using an `<iframe>` with the source URL provided by
Google Maps, allowing users to interact with the map directly.
What is the purpose of using semantic HTML tags like `<aside>`?
✔✔The `<aside>` tag is used for content that is related to the main content but can be considered
separate, like sidebars or pull quotes, improving document structure.
How do you create a responsive navigation menu that collapses on smaller screens?
3