Wayground logo

Free Printable Worksheets

Font size

S
M
L
XL
Worksheets

HTML & CSS Practice Test 5

Total questions: 54

Worksheet time: 28mins

Name
Class
Date
1.

Which of the following parts is not a valid part of the CSS box model?

a)

Padding

b)

Absolute

c)

Border

d)

Content

2.

To attach a shadow root to a custom element, you'd use which method?

a)

element.attachShadow()

b)

element.attachShadowRoot()

c)

element.shadowDOM()

d)

element.createShadow()

e)

element.addShadowRoot()

3.

Which of the following tag is used for drop down list?

a)

<select>

b)

<text>

c)

<textarea>

d)

<dropdown>

4.

Which HTML tag is used to create a table?

a)

<td>

b)

<table>

c)

<tabl>

d)

<tr>

e)

<data>

5.

In a flex container, which property is used to control the direction of the flex items?

a)

flex-row

b)

flex-align

c)

flex-wrap

d)

flex-direction

e)

flex-path

6.

Which of the following is NOT a valid value for the align-items property in a flex container?

a)

center

b)

flex-start

c)

stretch

d)

baseline

e)

space-between

7.

Which CSS selector will select all elements that are placed immediately after a element?

a)

div p

b)

p:after-div

c)

div + p

d)

div > p

e)

div ~ p

8.

If you want to display controls like play, pause, and volume on an audio or video tag, which attribute should you use?

a)

options

b)

settings

c)

features

d)

controls

e)

tools

9.

Which tag is used to group the footer content in a table?

a)

<tfooting>

b)

<bottom>

c)

<tfoot>

d)

<footer>

e)

<tr-foot>

10.

What is the purpose of the aria-live attribute in HTML?

a)

To indicate changes in content that user agents should announce.

b)

To associate a label with an element.

c)

To specify the level of importance of an element.

d)

To indicate that an element can be dragged and dropped

e)

To identify the current active element.

11.

Which pseudo-class targets elements based on their position in a list or a sequence of child elements?

a)

:order-child

b)

:location-child

c)

:sequence-child

d)

:position-child()

e)

:nth-child()

12.

Which element type should be used to properly display a YouTube video?

a)

<iframe>

b)

<visualframe>

c)

<h1>

d)

<youframe>

13.

If you want flex items to be laid out in multiple lines, what value should be used for the flex-wrap property?

a)

wrap-reverse

b)

fold

c)

multi-line

d)

nowrap

e)

wrap

14.

To use the Facebook JavaScript SDK in your webpage, which of these tags is most commonly added just after the opening body tag?

a)

<meta name='facebook-sdk'>

b)

<div id='facebook-jssdk'>

c)

<div id='fb-root'>

d)

<script src='facebook-sdk'>

e)

<div fb-root>

15.

To add an audio file to your webpage, which HTML5 tag should you use?

a)

<m p3>

b)

<sound>

c)

<audio>

d)

<play>

e)

<music>

16.

What is the main difference between a regular input box and a password input box?

a)

Password boxes automatically apply RSA encryption

b)

Password boxes mask the entered characters

c)

Password boxes enable an encrypted connection by default

d)

Password boxes scramble the order of the input

17.

Which ARIA attribute is used to specify that an element controls the appearance or disappearance of another element?

a)

aria-labelledby

b)

aria-label

c)

aria-live

d)

aria-controls

e)

aria-hidden

18.

What is the purpose of the ‘type’ element when creating a user entry form.

a)

To determine the CSS class to be used

b)

To control the maximum input length

c)

To control the positioning of the form

d)

To control the type of input required by the user

19.

Which pseudo-class selects elements that are the first child of their parent?

a)

:first

b)

:nth-child(1)

c)

:first-of-type

d)

:first-child

e)

:beginning-child

20.

What method allows an HTML custom element to be defined and registered?

a)

document.registerElement()

b)

document.createElement()

c)

HTMLCustomElement.create()

d)

window.customElements.define()

e)

window.customElement()

21.

Which of the following is NOT a valid timing function for CSS transitions and animations?

a)

ease-in-out

b)

cubic-bezier(0.1, 0.7, 1.0, 0.1)

c)

linear

d)

steps(4, end)

e)

fast-slow

22.

Which HTML5 tag is used to embed a video file into a webpage?

a)


<embed>

b)

<media>

c)


<clip>

d)

<mp4>

e)

<video>

23.

Which of the following is a JavaScript method commonly used to initialize and render a Google Map on a webpage?

a)

initMap()

b)


createMap()

c)

showMap()

d)

displayMap()

e)


renderMap()

24.

What CSS property allows you to define the number of columns in a grid layout?

a)

grid-columns

b)

column-count

c)

grid-template-columns

d)

grid-column-set

e)

column-grid

25.

Which pseudo-class targets only the element that the user is currently hovering over?

a)

:active

b)

:focus

c)

:target

d)

:over

e)

:hover

26.

To display a Facebook 'Like' button on your website, which of the following would you use?

a)

Facebook Graph API

b)

Facebook Plugins

c)

Facebook Authentication

d)

Facebook OAuth

e)

Facebook REST API

27.

Which of the following types of input should be used for selecting only one of several given choices?

a)

text

b)

radio

c)

button

d)

checkbox

28.

Correctly label the different parts of the Box Model

a)

border

b)

content

c)

margin

d)

padding

1
2
3
4
1)
2)
3)
4)
29.

The CSS box model is used when designing and laying out a page. Which sentence best describes the box model?

a)


It is a box that encapsulates each element and its associated data entered by the user

b)

It is a box that wraps around every HTML element on the page

c)

It is a box that is solely for the meta data on the page

d)

It is a box that is dragged around by the user of the page

30.

In an HTML table, which tag represents a table row?

a)

<thead>

b)

<td>

c)

<tr>

d)

<tbody>

e)

<column>

31.

If you want to add a title or caption to your table, which tag should you use?

a)

<title>

b)

<thead>

c)

<caption>

d)

<label>

e)

<header>

32.

Which of the following is NOT a valid value for the aria-live attribute?

a)

polite

b)

rude

c)

assertive

d)

off

e)

loud

33.

If a button, when activated, opens a navigation menu, which ARIA attribute can be used to notify screen reader users of its expanded or collapsed state?

a)

aria-hidden

b)

aria-expanded

c)

aria-pressed

d)

aria-owns

e)

aria-live

34.

What is the relationship between the Content and the padding?

a)

There is no relationship between content and padding

b)

The contents styling is dictated by the padding

c)

The padding creates spacing between the content and the border

d)

The level of padding is always relative to the content above it

35.

When integrating the Google Maps JavaScript API into a webpage, which of the following is required as a parameter in the script URL?

a)

passcode

b)

session

c)

id

d)

key

e)

token

36.

Which CSS property is used to define a container as a grid layout?

a)

layout: grid;

b)

display: block;

c)

box: grid;

d)

display: flex;

e)

display: grid;

37.

For an HTML custom element, which lifecycle callback is called when the custom element is first connected to the document's DOM?

a)

connectedCallback()

b)

createdCallback()

c)

attachedCallback()

d)

disconnectedCallback()

e)

replacedCallback()

38.

Which attribute in a form tag specifies the URL to which form data should be sent?

a)

action

b)

location

c)

sendto

d)

post

e)

url

39.

Which of the following encapsulates styles so they don't affect the outside world, and is part of the Web Components spec?

a)

enclosed DOM

b)

private DOM

c)

masked DOM

d)

hidden DOM

e)

shadow DOM

40.

Which of the following tags is used to represent the header of a table?

a)

<tfoot>

b)

<th>

c)

<head>

d)

<caption>

e)

<header>

41.

Which CSS property specifies the name of the @keyframes animation sequence you want to bind to an element?

a)

animate-name

b)

keyframe-name

c)

bind-animation

d)

animation-name

e)

apply-animation

42.

When used inside the <video> tag, what is the purpose of the <source> tag?

a)

It indicates the primary server for streaming.

b)

It provides a backup link in case the video fails.

c)

It defines the source of the video’s transcript.

d)

It points to an external website where the video is hosted.

e)

It specifies alternative video files for browsers that don't support the main file.

43.

To create a repeating back and forth animation effect, which animation-direction value would you use?

a)

replay

b)

backwards

c)

alternate

d)

reverse

e)

loop

44.

Which attribute would you use within the <video> tag to automatically start the video when a user lands on the page?

a)

playonload

b)

run

c)

start

d)

initiate

e)

autoplay

45.

Which HTML tag is used to create a form?

a)

<input>

b)

<submit>

c)

<textbox>

d)

<form>

e)

<fieldset>

46.

Which ARIA attribute can be used to provide a description to an element that requires a longer description than what a label can provide?

a)

aria-owns

b)

aria-details

c)

aria-describedby

d)

aria-role

e)

aria-labelledby

47.

Which CSS selector will select all <p> elements that are placed immediately after a <div> element?

a)

p:after-div

b)

div p

c)

div > p

d)

div + p

e)

div ~ p

48.

Which CSS value pauses an animation and displays the current frame?

a)

freeze

b)

halted

c)

stopped

d)

none

e)

paused

49.

Which of the following selectors will select all <p> elements that are direct children of a <div> element?

a)

div p

b)

p.in-div

c)

div ~ p

d)

div + p

e)

div > p

50.

Which attribute determines the HTTP method (GET/POST) used to submit the form data?

a)

send-method

b)

methodology

c)

type

d)

method

e)

data-send

51.

Which phrase correctly defines the acronym SVG?

a)

Scalable Volume Graphic

b)

Support Vector Graphic

c)

Support Volume Graphic

d)

Scalable Vector Graphic

52.

Which of the following are NOT a valid mode for the shadow DOM?

a)

private

b)

open

c)

enclosed

d)

closed

e)

hidden

53.

Which input type is used to create a submit button in a form?

a)

<input type='click'>

b)

<input type='button'>

c)

<button type='submit'>

d)

<input type='submit'>

e)

<input type='go'>

54.

Which tag in an HTML form creates a dropdown list for users?

a)

<dropdown>

b)

<menu>

c)

<optionlist>

d)

<select>

e)

<list>

Similar Resources on Wayground

AP CS P 5.1

50 questions

AP CS P 5.1

quiz

Worksheet

•

10th Grade - University

Computer Servicing Ch 1-3 Review

53 questions

Computer Servicing Ch 1-3 Review

quiz

Worksheet

•

9th - 12th Grade

US INFORMATIKA SEMUA JURUSAN 2025

50 questions

US INFORMATIKA SEMUA JURUSAN 2025

quiz

Worksheet

•

12th Grade

Pemrograman Dasar

50 questions

Pemrograman Dasar

quiz

Worksheet

•

10th - 12th Grade

HTML

50 questions

HTML

quiz

Worksheet

•

8th Grade - University

LATIHAN PAT INFORMATIKA KELAS X

50 questions

LATIHAN PAT INFORMATIKA KELAS X

quiz

Worksheet

•

9th - 12th Grade

Uji Pengetahuan UKK TKJ 2023

50 questions

Uji Pengetahuan UKK TKJ 2023

quiz

Worksheet

•

9th - 12th Grade

General Trivia Quiz 2025

49 questions

General Trivia Quiz 2025

quiz

Worksheet

•

6th Grade - University