HTML Basic Media and Links - Mock Test

Question 1 of 20

What is the correct way to add alternative text to an image in HTML to ensure accessibility?

Choose 1 answer

A. <img src='image.jpg' description='A beautiful landscape'>

B. <img src='image.jpg' alt='A beautiful landscape'>

C. <img src='image.jpg' alt=''>

D. <img href='image.jpg' alt='A beautiful landscape'>

Question 2 of 20

Which of the following code snippets correctly creates a link that opens in a new tab?

Choose 1 answer

A. <a href='https://example.com' target='_blank'>Visit Example</a>

B. <a href='https://example.com' target='_newtab'>Visit Example</a>

C. <a href='https://example.com' newtab='_blank'>Visit Example</a>

D. <a href='https://example.com' open='_blank'>Visit Example</a>

Question 3 of 20

What will happen if you create an image link using the following code? ```html <a href='#'><img src='logo.png' alt='Logo'>n</a> ```

Choose 1 answer

A. The image will link to the same page.

B. The image will not function as a link.

C. The image will display without linking.

D. The image will link to 'logo.png'.

Question 4 of 20

In the following scenario, how can you ensure that the image maintains its aspect ratio while scaling to 100% of the browser width? ```html <img src='example.jpg' width='100%'> ```

Choose 1 answer

A. Add 'height="auto"' to the image tag.

B. Add 'height="100%"' to the image tag.

C. Add 'style="max-width: 100%; height: auto;"'.

D. Add 'aspect-ratio="auto"'.

Question 5 of 20

Consider the following HTML code: ```html <a href='mailto:support@example.com'>Contact Us</a> ``` What will happen when the user clicks on this link?

Choose 1 answer

A. A new browser tab will open with a contact form.

B. A new email message will be created with 'support@example.com' as the recipient.

C. The user will be redirected to the support page.

D. The link will not work unless JavaScript is enabled.

Question 6 of 20

What is the correct way to make an image act as an email link in HTML? ```html n <a href='_______'><img src='email-icon.png' alt='Email Us'></a> ```

Choose 1 answer

A. href='mailto:support@example.com'

B. href='support@example.com'

C. href='email:support@example.com'

D. href='mailto://support@example.com'

Question 7 of 20

You want to display an image only if it exists. If the image is not found, nothing should appear. What is the correct HTML and CSS combination to achieve this? ```html <img src='non-existent.jpg' alt=''> ``` Which CSS rule should be applied?

Choose 1 answer

A. img { display: none; }

B. img:not([src]) { display: none; }

C. img:empty { display: none; }

D. img { visibility: hidden; }

Question 8 of 20

Given the following HTML code, what is the result? ```html <a href='#section2'>Go to Section 2</a> n<div id='section2'>This is Section 2n</div> ```

Choose 1 answer

A. The link will take the user to the second section of the same page.

B. The link will not work because the id attribute is invalid.

C. The link will redirect to a 404 error.

D. The link will open a new page with Section 2.

Question 9 of 20

What will be the result of the following code? ```html <a href='https://example.com' title='Visit Example'>Example</a> ```

Choose 1 answer

A. The link text 'Example' will display, and when hovered over, a tooltip 'Visit Example' will appear.

B. The link will not work because the 'title' attribute is incorrect.

C. The link text will be replaced with 'Visit Example'.

D. The link will open in a new tab.

Question 10 of 20

Which of the following is the correct syntax for adding a favicon to an HTML page?

Choose 1 answer

A. n<link rel='favicon' href='favicon.ico'>

B. n<link rel='icon' href='favicon.ico' type='image/x-icon'>

C. <img rel='icon' src='favicon.ico'>

D. <img rel='favicon' href='favicon.ico'>

Question 11 of 20

What is the outcome of the following code? ```html <a href='image.jpg'>Click here to view the image</a> ```

Choose 1 answer

A. The image will be displayed directly on the page.

B. The user will download 'image.jpg' when clicking the link.

C. The link will navigate to the image, displaying it in the browser.

D. The link will not work without a proper 'img' tag.

Question 12 of 20

What is the purpose of the 'target="_blank"' attribute in the following link? ```html <a href='https://example.com' target='_blank'>Visit Example</a> ```

Choose 1 answer

A. It opens the link in the same tab.

B. It forces the link to open in a new tab.

C. It forces the link to download the content.

D. It creates a pop-up window for the link.

Question 13 of 20

What does the 'rel="noopener noreferrer"' attribute pair in the following link do? ```html <a href='https://example.com' target='_blank' rel='noopener noreferrer'>Visit Example</a> ```

Choose 1 answer

A. It allows the target page to track referrer information.

B. It prevents the target page from gaining control of the opener page.

C. It disables link functionality.

D. It makes the link open in a new tab without any additional effect.

Question 14 of 20

What will happen when this code is executed? ```html <a href='mailto:?subject=Hello&body=This%20is%20a%20message'>Send Email</a> ```

Choose 1 answer

A. A new email will open with a predefined subject and body.

B. An error will occur because 'mailto:' cannot have query parameters.

C. The link will open the user's email client, but with no subject or body.

D. The link will redirect the user to a contact page.

Question 15 of 20

How can you ensure that the following image does not break if the image path is incorrect? ```html <img src='image.jpg' alt='Alternative Text'> ```

Choose 1 answer

A. Add 'onerror="this.src='default.jpg';"'.

B. Add 'alt=""' to prevent it from breaking.

C. Add 'width="0"' and 'height="0"' attributes.

D. Use the n<picture> element instead.

Question 16 of 20

What will happen when the following code is used? ```html <a href='data:image/png;base64,...'>Download Image</a> ```

Choose 1 answer

A. The user will download the image encoded in base64 format.

B. The user will see the image directly in the browser.

C. The browser will fail to open the link.

D. The link will open in a new tab and display HTML.

Question 17 of 20

Which of the following is the correct way to preload an image in HTML?

Choose 1 answer

A. <img src='image.jpg' preload='auto'>

B. n<link rel='preload' href='image.jpg' as='image'>

C. n<script src='image.jpg' preload='image'>

D. <img src='image.jpg' prefetch='true'>

Question 18 of 20

What is the correct HTML syntax for linking to a file download?

Choose 1 answer

A. <a href='file.pdf' target='_blank'>Download File</a>

B. <a href='file.pdf' download>Download File</a>

C. n<a download='file.pdf'>Download File</a>

D. <a href='file.pdf' target='_download'>Download File</a>

Question 19 of 20

What is the outcome when this code is executed? ```html <a href='https://example.com/image.jpg' download='newimage.jpg'>Download Image</a> ```

Choose 1 answer

A. The image will be displayed in the browser.

B. The image will download as 'image.jpg'.

C. The image will download as 'newimage.jpg'.

D. The download will fail because the file is hosted on a different domain.

Question 20 of 20

Consider the following code snippet: ```html <img src='logo.png' alt='Company Logo' width='300' height='200'> ``` What is the purpose of including the width and height attributes?

Choose 1 answer

A. To scale the image to fit within a container.

B. To reserve space for the image while it loads.

C. To maintain the image's original aspect ratio.

D. To set the image size for different devices.

Media & Links

Practice Test

Question 1 of 20

Choose 1 answer

Question 2 of 20

Choose 1 answer

Question 3 of 20

Choose 1 answer

Question 4 of 20

Choose 1 answer

Question 5 of 20

Choose 1 answer

Question 6 of 20

Choose 1 answer

Question 7 of 20

Choose 1 answer

Question 8 of 20

Choose 1 answer

Question 9 of 20

Choose 1 answer

Question 10 of 20

Choose 1 answer

Question 11 of 20

Choose 1 answer

Question 12 of 20

Choose 1 answer

Question 13 of 20

Choose 1 answer

Question 14 of 20

Choose 1 answer

Question 15 of 20

Choose 1 answer

Question 16 of 20

Choose 1 answer

Question 17 of 20

Choose 1 answer

Question 18 of 20

Choose 1 answer

Question 19 of 20

Choose 1 answer

Question 20 of 20

Choose 1 answer

Quick Link

Query

Follow Us