wayground logo

Free Printable Worksheets

Font size

S
M
L
XL
Worksheets

JavaScript and CSS Quiz

Total questions: 107

Worksheet time: 54mins

Name
Class
Date
1.

What is used to insert at the [MISSING] to change the display property of the p tag to "block"

a)

nothing

b)

p

c)

this

d)

object

2.

What of the following code do you choose to insert at [MISSING CODE] to check device width is 400px or larger?

a)

min-device-width: 400px

b)

min-width: 400px

c)

device-width: 400px

d)

max-device-width: 400px

3.

What statement do you insert the 3rd line to get a list of images in the document?

a)

var list=document.getElementById("abc")

b)

var list=document.getElementsByTagName("image")

c)

var list=document.getElementsByTagName("img")

4.

What is the correct JavaScript syntax to the 2nd paragraph display inline?

a)

document.getElementsByTagName("p")[1].style.display="inline";

b)

document.getElementsByTagName("p")[2].style.display="inline";

c)

document.getElementsByName("p")[1].style.display="inline";

d)

document.getElementsByName("p")[2].style.display="inline";

5.

What of the following code do you choose to insert at [MISSING CODE] to check the media feature that is the orientation of the viewport (landscape or portrait mode)?

a)

orientation

b)

printation

c)

ratio

d)

direction

6.

What of the following code do you choose to insert at [MISSING CODE] to check device width is 768px or smaller?

a)

min-device-width: 768px

b)

min-width: 768px

c)

device-width: 768px

d)

max-device-width: 768px

7.

What statement do you use to change the style property of a tag with id="demo"?

a)

document.getElementById("demo").style-newvalue

b)

"demo" style=newvalue

c)

style=newvalue

d)

None of the others

8.

What statement do you insert the 3rd code line to get a list of images in p tag?

a)

var list="abc".getElementsByTagName("img")

b)

var list=document.getElementById("abc").getElementsByTagName("img")

c)

var list=document.getElementById("abc").getElementsByClassName("img")

d)

var list=document.getElementById("abc").getElementsByName("img")

9.

What validation error will this code produce?

a)

Start tag seen without seeing a doctype first. Expected e.g!DOCTYPE html>.

b)

No p element in scope but a p end tag seen.

c)

No error

10.

What of the following code do you choose to insert at [MISSING CODE] to check the media type is used for computer screens, tablets, smart-phones, etc. with its width from 768px and up?

a)

screen

b)

print

c)

all

d)

mobile

11.

What is wrong with the following code?

<a href="picture.jpg">My dog</a> chews socks.

a)

The link in the href must have a full URL

b)

The alt text attributes is missing from the tag

c)

You can not have text after the closing </a> tag.

d)

D. This code is semantically and syntactically correct

12.

What statement do you insert the 4th line to create an image in div tag?

a)

document.write("<img src ="image.jpg">";)

b)

tag.innerHTML="<img src ="image.jpg">";

c)

tag.appendChild("");

d)

D. tag.appendChild("");

13.

What is returned when the method myFunction called?

a)

true

b)

-1

c)

7

d)

0

14.

What statement is the right to append obj object to tag object in the 3rd line?

1.var obj=document.createElement("img")

2.var tag=document.getElementById("demo")

a)

tag.innerHTML=obj

b)

tag.value=obj

c)

tag.text=obj

d)

tag.appendChild(obj)

15.

What of the following code do you choose to insert at [MISSING CODE] to check the media feature that is the orientation of the viewport (landscape or portrait mode)?

@media only screen and ([MISSING CODE]) { body { background-image: url('img_flowers.jpg');}

a)

orientation

b)

printation

c)

ratio

d)

direction

16.

What unit is used to fix the size of an element (it will appear exactly this size)?

a)

Vmax

b)

Vmin

c)

%

d)

mm

17.

What grid classes that cross the page are in the Bootstrap 3 Grid System?

a)

sm

b)

xs

c)

md

d)

Lg

e)

All of the others

18.

What is the correct HTML for creating a hyperlink?

a)

http://fpthcm.edu.vn

b)

fpt-uni

c)

fpt-uni

d)

fpt-uni

19.

What unit is used to specify the font size that relative to 1% of viewport's smaller dimension?

a)

Rem

b)

Vmin

c)

%

d)

Px

20.

What validation error will this code produce?

a)

Element head is missing a required instance of child element title.

b)

End of file seen when expecting text or an end tag.

c)

No error.

21.

What statement do you insert the 3rd line to invisible an image?

a)

obj.opacity=0;

b)

obj.visibility=0;

c)

obj.style.display="none";

d)

obj.style.visibility="visible";

22.

What is the value of the variable n?

a)

6

b)

5

c)

7

d)

null

23.

What is the correct JavaScript syntax to change the content of the HTML element below?

a)

document.getElementById("demo").innerHTML = "Hello World!";

b)

#demo.innerHTML = "Hello World!";

c)

document.getElement(

d)

document.getElementById("demo").innerHTML = "Hello World!";

24.

content of the HTML element below?

a)

document.getElementById("demo").innerHTML = "Hello World!";

b)

#demo.innerHTML = "Hello World!";

c)

document.getElement("p").innerHTML = "Hello World!";

d)

document.getElementByName("p").innerHTML = "Hello World!";

25.

What is the width of the left border?

a)

9px

b)

5px

c)

3px

d)

10px

26.

What is wrong with this code? var name = "Mike"; "Colleen" = name,

a)

It is illegal to change the value stored in a variable.

b)

This code is illegal and it doesn't make sense to have a non-variable (also called a constant) in the left-hand side (LHS) of an assignment statement.

c)

The variable declaration is illegal.

27.

What output is right of above function?

a)

To change the src property of the image with id="demo"

b)

To change the src property of the image

c)

To change the src property of the image that holds the event

d)

None of the others

28.

What is the correct HTML for creating a hyperlink?

a)

a>http://fpthcm.edu.vn

b)

fpt-uni

c)

fpt-uni

d)

fpt-uni

29.

What statement do you choose to append

new tag in body element?

a)

document.body.innerHTML(document.createElement("p"))

b)

document.body.appendChild(document.getElementById("demo"))

c)

document.body.appendChild(document.createElement("p"))

d)

None of the others

30.

What is a right statement?

a)

Syntax error

b)

retrieves the text of an

element and copies it into a

element

c)

retrieves the text of an

element and copies it into a

element

d)

None of the others

31.

Which method to choose the total width of the div tag is 200px?

a)

box-sizing: content-box

b)

box-sizing: border-box

c)

box-sizing: Inherited

32.

What is the output of the above code?

a)

Syntax error

b)

Banana Orange Apple Mango undefined undefined Lemon

c)

Banana Orange Apple Mango Lemon

d)

Banana Orange Apple Mango Inull

33.

Which of the following code segments will keep people from being able to zoom in or out on

a)

A.

b)

c)

It is impossible to lock the zoom ability

d)

All of the others

34.

Which HTML attribute is used to define inline CSS styles?

a)

CSS

b)

style

c)

type

d)

id

35.

What is the correct HTML for referring to an external style sheet stored in a subfolder called css?

a)

b)

c)

d)

36.

Which property is used to specify typefaces?

a)

font-family

b)

font-name

c)

font-face

d)

font-type

37.

Which of the following is an example of a top-level domain?

a)

.com

b)

umich.edu

c)

wikipedia.org

38.

Which of the following is the relative unit that is relative to the font-size of the root element?

a)

pc

b)

px

c)

mm

d)

rem

39.

Which is the correct file extension for a web page?

a)

html

b)

java

c)

js

d)

.cpp

40.

Which HTML tag is used to define an internal style sheet?

a)

b)

c)

d)

41.

Which of the following code using Bootstrap 3 to set up two columns of the page in an sm viewport with 4 columns wide and 8 columns wide?

a)

col-sm-4 and col-sm-8

b)

col-lg-4 and col-sm-8

c)

col-sm-4 and col-md-8

d)

col-md-4 and col-lg-8

42.

Which of the following is not a valid variable name?

a)

variable-2

b)

variable$2

c)

variable_2

43.

Which fluid measurement type returns a percentage of the viewport height?

a)

vh

b)

vw

c)

hv

d)

Wv

44.

Which of the following code is the correct way to link to an email address?

a)

b)

c)

45.

Which of the following is the proper syntax for a pseudo-class?

a)

pseudo-class { } property value;

b)

selector->pseudo-class { property.value; }

c)

selector pseudo-class ( property value; }

d)

selector pseudo-class ( property.value; }

46.

Which of the following is used to represent Visited hyperlink?

a)

visited

b)

clicked

c)

focus

d)

:link

47.

Which of the following code segments will keep people from being able to zoom in or out on your content?

a)

b)

c)

It is impossible to lock the zoom ability

d)

D. All of the others

48.

Which of the following would be used to create class called button which has a width of 750px, a height of 30px and the color of the text is black?

a)

#button {height: 30px; width: 750px; text: black; }

b)

.button { height: 30px; width: 750px; color: black; }

c)

.button { height: 30px; width: 750px; text: black; }

49.

Which code will properly insert headings along each row?

a)

b)

c)

50.

Which method to choose the total width of the div tag is 200px?

a)

box-sizing: content-box

b)

box-sizing: border-box

c)

box-sizing: Inherited

51.

Which of the following code segments will keep people from being able to zoom in or out on your content?

a)

b)

c)

It is impossible to lock the zoom ability

d)

All of the others

52.

Which class adds zebra-stripes to a table?

a)

table-bordered

b)

table-striped

c)

even and odd

d)

table-zebra

53.

Which tag is used to create a link?

a)

<link>

b)

<a>

c)

<anchor>

d)

<hyper>

54.

Which measurement is easier and comfortable for the designer/developer to use when coding?

a)

em

b)

rem

c)

px

d)

%

55.

Which class provides a responsive fixed width container?

a)

.container-fluid

b)

container

c)

.container-fixed

d)

All of the others

56.

Which of the following is the best example of declaring at-rule in CSS?

a)

@-import

b)

@import

c)

at-import

d)

at@import

57.

Which of the following line of code can be used to hide the image?

a)

img { display: 0;}

b)

img { display: block; }

c)

img { display: none; }

d)

img { display: empty; }

58.

Which of the following would be used to create the class called header which has a width of 200px and the color of the text is blue?

a)

header {width:750px; height:200px; color:blue; }

b)

.header { width:750px; height:200px; color:blue; }

c)

#header { width:200px; width:750px; text:blue;}

d)

header(height=200px; width=750px; color-blue; }

59.

Which of these tags breaks the tenet of the separation of content and layout?

a)

Body

b)

Font

c)

h1

60.

Which of these is not valid? (Hint, pay attention to if the method should return one thing or more)

a)

document.getElementsById(idName)

b)

document.getElementsByClassName(className)

c)

document.getElementsByTagName(tagName)

d)

document.getname(Name)

61.

Which snippet of CSS is commonly used to center an element horizontally?

a)

site-align: center;

b)

margin: auto 0;

c)

margin: 0 auto;

d)

margin: center;

62.

The image will scale down if it has to, but never scale up to be larger than its original size. Which code is right?

a)

Width:100%

b)

Max-width:100%

c)

Scale: 100%

d)

min-width: 100%

63.

Which is the correct CSS syntax?

a)

{body;color:black;}

b)

body:color=black;

c)

(body color-black;}

d)

body {color: black;}

64.

Which method is used to search for a match, and returns the position of the match?

a)

match()

b)

search()

c)

test()

d)

replace()

65.

How do you make the text bold?

a)

style:bold;

b)

font-weight:bold;

c)

font:bold;

d)

text:bold;

66.

How do you make each word in a text start with a capital letter?

a)

text-transform capitale

b)

transform: capitalize

c)

text-style: capitalize

d)

style cap

67.

How many type faces inside property "font-family"?

a)

1

b)

Maximum 2

c)

No Limit

d)

Maximum 3

68.

How much horizontal space ("width") will this div use? div width:50px; padding: 10px; margin: 5px; border: 2px; }

a)

74px

b)

50px

c)

70px

d)

54px

69.

How can you created rounded corners using CSS3?

a)

border[round]: 30px;

b)

border-radius: 30px;

c)

corner-effect: round;

d)

alpha-effect: round-corner,

70.

How many ways are there to integrate CSS into a web page?

a)

2

b)

3

c)

4

d)

5

71.

How do you properly access the third element in an array variable named "fruit"?

a)

[fruit]3

b)

fruit[3]

c)

fruit_3

d)

None of the others

72.

How do you display hyperlinks without an underline?

a)

a (underline:none;}

b)

a (text-decoration:no-underline;}

c)

a (decoration:no-underline;}

d)

a {text-decoration:none;}

73.

How to create transition effects using CSS3?

a)

transition: width 2s;

b)

transition-duration: 2s;

c)

aphe-effect: transition (width 2s);

d)

transition-effect: width;

74.

How can you open a link in a new tab/browser window?

a)

b)

c)

d)

75.

How can you insert a search icon?

a)

b)

c)

d)

76.

Consider the below code: var x=5+5 var y='5"+5; var z="Hello" + 5; Which statement is right about the result of x,y,z?

a)

10,55,Hello5

b)

55,10,Hello5

c)

Hello5,10,55

d)

Hello5,55,10

77.

Consider the following CSS rules: div width: 80%; @media all and (min-width:500px){ div{ } width: 25%; What is the width of any div elements on a 750px screen?

a)

80%

b)

100%

c)

25%

78.

Consider the code: h1 { color: blue; font-size: 20px;} Which of the following is called "selector"?

a)

color and font-size

b)

h1

c)

All parts of the code above

d)

blue and 20px

79.

Consider the code .center { text-align: center color: red; What is the right statement?

a)

All HTML elements with class="center" will be red and center-aligned.

b)

only one HTML element with class="center" will be red and center-aligned.

c)

only one HTML element with id="center" will be red and center-aligned.

d)

All HTML elements with id="center" will be red and center-aligned.

80.

Consider the code body font-size: 16px; Pl font-size: 100%; border: 1px solid black;

This is a song

What is the right option?

a)

The font-size of this document is 16px

b)

The font size of the p element is 16px

c)

The % unit sets the font-size relative to the font-size of the parent element.

d)

All of the others

81.

Consider some options: (A) Use relative units (B) we should set a static value for every HTML element, like 600 pixels. (C) Use a grid-view system (D) take control over the viewport, through the tag. (E) Use min-height, max-height properties for setting the size of the element. What option should be used in the fluid layout design?

a)

A,B,C

b)

B,C,E

c)

A,C,D

d)

B,D,E

82.

Consider the code:

What code is the right statement to assign the sum of two integers 4,3 to the p tag at the r [MISSINGCODE]?

a)

document.getElementById("demo").innerHTML=myFun-tion(4,3);

b)

c)

d)

83.

Consider two statements: Statement 1: You can insert one or many "responsive breakpoints" in your stylesheet. But you should choose a mobile-first approach to design. Statement 2: Responsive web design generates many completed layouts. Each layout is done individually for each device type. Choose the right option.

a)

Statement 1 is true, statement 2 is true

b)

Statement 1 is false, statement 2 is false

c)

Statement 1 is true, statement 2 is false

d)

Statement 1 is false, statement 2 is true

84.

Choose the right statement about the total width of a tag.

a)

Total width: 320px

b)

Total width: 300px

c)

Total width: 310px

d)

Total width: 370px

85.

var op=document.createElement("option"); op.innerHTML="Apple"; Choose a right statement?

a)

Create an option

b)

Create an option with id="Apple"

c)

Create an option and its HTML content is "Apple"

d)

None of the others

86.

Consider the following CSS rules: div { width: 80%; } @media all and (max-width: 767px) { div { width: 25%; } } What is the width of any div elements on a 500px screen?

a)

80%

b)

75%

c)

100%

d)

25%

87.

Consider the following CSS rules: @media all and (max-width: 767px) { div { width: 50%; } } div { width: 80%; } What is the width of any div elements on a 500px screen?

a)

80%

b)

75%

c)

100%

d)

50%

88.

function change(obj) { while(obj.length>0) obj.remove(0); } Choose a right statement?

a)

None of the others

b)

Remove an option

c)

Remove an option by zero-based index

d)

Remove all options by their index

89.

Consider the below code: div {width:50%; height:300px; overflow:scroll; }

Choose the right statement?

a)

Script to be run when an element's scrollbar is being scrolled

b)

The Script cannot run because the "onscroll" event is not supported by all browsers.

c)

Script to be run when a div's scrollbar is being scrolled

d)

Script to be run when window's scrollbar is being scrolled

90.

Consider the code:

What code is the right statement to assign the sum of two integers 4,3 to the p tag at the row [MISSINGCODE]?

a)

document.getElementById("demo").innerHTML=myFun-tion(4,3);

b)

c)

document.getElementById("demo").innerHTML="4"+"3";

d)

document.getElementById("demo").innerHTML= myFun-tion("4","3");

91.

Consider the code:

What code is added at [MISSING CODE] to set the text "mango" of the variable arr to the input tag with id="demo"?

a)

document.getElementById("demo").text=arr

b)

document.getElementById("demo").value=arr[1]

c)

document.getElementById("demo")=arr[1]

d)

document.getElementById("demo").value=arr[2]

92.

Choose the right statement?

a)

A Script to be run when an element's scrollbar is being scrolled

b)

The Script cannot run because the 'onscroll' event is not supported by all browsers.

c)

Script to be run when a div's scrollbar is being scrolled

d)

Script to be run when window's scrollbar is being scrolled

93.

What data does the form send to the page myscript.aspx after submitting?

a)

nothing

b)

female and ThiNo

c)

female and male

d)

1 and ThiNo

94.

What statement do you use to change name = 'Nga' to 'My'?

a)

Person.firstName='My'

b)

Person[0].firstName='My'

c)

Person[1].firstName='My'

d)

none of the others

95.

Choose the right statement about the code below?

a)

the image will scale down if it has to, but never scale up to be larger than its original size

b)

the image can be scaled up to be larger than its original size

c)

the image is displayed in the same its original size

d)

The image can scale up or down base on the viewport wide

96.

Choose the right output?

a)

Return array

b)

Return all img tags in the tag with id='demo'

c)

Return all img tags in a document.

d)

None of the others

97.

Choose the right statement?

a)

A div element is formatted such as a double border-style and black border-color

b)

A div element is formatted such as a single solid border-style and black border-color

c)

A div element is formatted such as a double border-style and any border-color

d)

A div element is formatted such as a dotted border-style and black border-color

98.

Choose the right statement about the code below?

a)

When the screen (browser window) gets smaller than 768px, each column should have a width of 100%

b)

When the screen (browser window) gets greater than 768px, each column should have a width of 100%

c)

Each column should have a width of 100% for any screen wide

d)

When the screen (browser window) or mobile gets smaller than 768px, each column should have a width of 100%

99.

Which of the following is a true statement?

a)

The div elements will have a width of 25% only when the page is printed

b)

The div elements will only visible only when the page is printed

c)

The div elements will have a width of 80% only when the page is printed

100.
a)

A. The font-size of this document is 16px

b)

B. The font-size of the div with id="mycss" is 2x the browser's font size

c)

C. The rem unit sets the font-size relative to the browsers base font-size, and will not inherit from its parents.

d)

D. All of the others

101.
a)

A. Statement 1 is true and statement 2 is true

b)

B. Statement 1 is false and statement 2 is false

c)

C. Statement 1 is true and statement 2 is false

d)

D. Statement 1 is false and statement 2 is true

102.

If the function was invoked from a statement, JavaScript will "return" to execute the code after the invoking statement. Choose the right option

a)

A. Statement 1 is true, statement 2 is true

b)

B. Statement 1 is false, statement 2 is false

c)

C. Statement 1 is true, statement 2 is false

d)

D. Statement 1 is false, statement 2 is true

103.
a)

A. A div element is formatted such as a double border-style and black border-color

b)

B. A div element is formatted such as a single solid border-style and black border-color

c)

C. A div element is formatted such as a double border-style and any border-color

d)

D. A div element is formatted such as a dotted border-style and black border-color

104.

Consider two statements: Statement 1: You can insert one or many "responsive breakpoints" in your stylesheet. This supports a mobile-first approach to design. Statement 2: Responsive web design generates many completed layouts. These are created individually for each device type.

Choose the right option

a)

A. Statement 1 is true, statement 2 is true

b)

B. Statement 1 is false, statement 2 is false

c)

C. Statement 1 is true, statement 2 is false

d)

D. Statement 1 is false, statement 2 is true

105.

Consider two statements: Statement 1: The code inside the function will execute when "something" invokes (calls) the function. Statement 2: If the function was invoked from a statement, JavaScript will "return" to execute the code after the invoking statement.

Choose the right option

a)

A. Statement 1 is true, statement 2 is true

b)

B. Statement 1 is false, statement 2 is false

c)

C. Statement 1 is true, statement 2 is false

d)

D. Statement 1 is false, statement 2 is true

106.
a)

A. If the device's width is larger than 500px, the background color will change to light blue

b)

B. If the device's width is smaller than 500px, the background color will change to light blue

c)

C. If the browser window is larger than 500px, the background color will change to light blue

d)

D. If the browser window is smaller than 500px, the background color will change to light blue

107.
a)

A. moves an element from its current position

b)

B. moves an element from its (0,0) position

c)

C. moves the <div>

element 50 pixels to the right, and 100 pixels down from its current position

d)

D. moves the <div>

element 50 pixels to the right, and 100 pixels down from its (0,0) position

Similar Resources on Wayground

idioms

110 questions

idioms

quiz

Worksheet

•

Professional Development

Snake Oil

103 questions

Snake Oil

quiz

Worksheet

•

Professional Development

Post-Teach Session 5 TEST - English Language Course

111 questions

Post-Teach Session 5 TEST - English Language Course

quiz

Worksheet

•

KG - Professional Dev...

Year 5 Starter Unit - Language Focus

103 questions

Year 5 Starter Unit - Language Focus

quiz

Worksheet

•

1st Grade - Professio...

Grammar& vocabulary

102 questions

Grammar& vocabulary

quiz

Worksheet

•

Professional Development

Mathias practice

107 questions

Mathias practice

quiz

Worksheet

•

Professional Development

REVIEW 12

110 questions

REVIEW 12

quiz

Worksheet

•

Professional Development

Law School Vocabulary Quiz

103 questions

Law School Vocabulary Quiz

quiz

Worksheet

•

Professional Development