VS CODE SIMPLE ANIMATION

Froggy Jumps

Parties jouées 20 %Précision 66 Temps moyen 14:48

Créer une copie

À propos de cette activité

Recalling of past lesson

Créé par

belle

Philippines

Téléchargez la version pour jouer sur papier

Top 10 résultats

#	Jeux	Précision	temps
1	belle 10 Août 2026	% 100	00:21
2	group 2 10 Août 2026	% 100	01:31
3	yunnooo 14 Août 2026	% 84	18:43
4	----- 14 Août 2026	% 76	18:43
5	‎ ￴ ￴ ￴ ￴ ￴ ￴ ￴ ￴￴ ￴ ￴ ￴ ￴ ￴ ￴ ￴ ￴ ￴ ￴ ￴ ￴￴￴￴ ￴ 14 Août 2026	% 72	18:43
6	Anonyme 10 Août 2026	% 67	00:45
7	GROUP 1 10 Août 2026	% 67	01:31
8	Abuldabar 13 Août 2026	% 67	13:20
9	Buwaya yarn?? 13 Août 2026	% 67	13:20
10	Pusikat 14 Août 2026	% 64	18:43

Voulez-vous apparaître dans le Top 10 de ce jeu? Connectez-vous pour vous identifier.

Créez votre propre jeu gratuite à partir de notre créateur de jeu

Affrontez vos amis pour voir qui obtient le meilleur score dans ce jeu

Créer un défi

Phlebotomy Order of Draw Quiz

Pamela Chapman

United States

(66)

Test your knowledge of the order of draw in Phlebotomy with these 10 questions!
The Integumentary System

Breanna Nesbitt

United States

(60)

Functions and Structures of the skin
Ethos, Pathos, and Logos Quiz

Kristine Vester

United States

(147)

Test your knowledge of ethos, pathos, and logos with these 10 questions on examples of persuasive techniques.
Bill of Rights Game - The Constitutionalist

Doni The Don

United States

(93)

Test your knowledge on the Bill of Rights. A fun way to test your knowledge and focus on where you need to improve.
pizza

Lorelay Tyana

Romania

(280)

joc despre pizza

		%
	Anonyme	%
		%
		%

Imprimez votre jeu

VS CODE SIMPLE ANIMATION


Froggy Jumps VS CODE SIMPLE ANIMATIONVersion en ligne Recalling of past lesson par belle 1 1. What is the main purpose of HTML in the website created yesterday? a A. To structure the webpage b B. To animate the box c C. To change the internet connection 2 Which HTML tag is used to create the main heading “MY FIRST ANIMATION”? a A. b B. c C. </p> </label> </div> </section> <section class="gameboard__screen"> <div class="gameboard__screen__wrapper"> <div class="gameboard__screen__question"> <span class="gameboard__screen__question__number">3</span> <h3 class="gameboard__screen__question__heading"> <link rel="stylesheet" href="firstanimation.css"> </h3> </div> </div> <div class="gameboard__screen__wrapper"> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">a</span> <p class="gameboard__screen__answer__body"> It creates an animation </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">b</span> <p class="gameboard__screen__answer__body"> It connects the HTML file to a CSS file </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">c</span> <p class="gameboard__screen__answer__body"> It creates a new webpage </p> </label> </div> </section> <section class="gameboard__screen"> <div class="gameboard__screen__wrapper"> <div class="gameboard__screen__question"> <span class="gameboard__screen__question__number">4</span> <h3 class="gameboard__screen__question__heading"> Which HTML element was used to create the animated box? </h3> </div> </div> <div class="gameboard__screen__wrapper"> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">a</span> <p class="gameboard__screen__answer__body"> <square> </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">b</span> <p class="gameboard__screen__answer__body"> <box> </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">c</span> <p class="gameboard__screen__answer__body"> <div> </p> </label> </div> </section> <section class="gameboard__screen"> <div class="gameboard__screen__wrapper"> <div class="gameboard__screen__question"> <span class="gameboard__screen__question__number">5</span> <h3 class="gameboard__screen__question__heading"> What does class="box" do in the code </h3> </div> </div> <div class="gameboard__screen__wrapper"> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">a</span> <p class="gameboard__screen__answer__body"> It makes the element automatically move </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">b</span> <p class="gameboard__screen__answer__body"> It changes the element into a heading </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">c</span> <p class="gameboard__screen__answer__body"> t identifies the element so CSS can style it </p> </label> </div> </section> <section class="gameboard__screen"> <div class="gameboard__screen__wrapper"> <div class="gameboard__screen__question"> <span class="gameboard__screen__question__number">6</span> <h3 class="gameboard__screen__question__heading"> Which CSS property controls the width of the box? </h3> </div> </div> <div class="gameboard__screen__wrapper"> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">a</span> <p class="gameboard__screen__answer__body"> size </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">b</span> <p class="gameboard__screen__answer__body"> width </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">c</span> <p class="gameboard__screen__answer__body"> height </p> </label> </div> </section> <section class="gameboard__screen"> <div class="gameboard__screen__wrapper"> <div class="gameboard__screen__question"> <span class="gameboard__screen__question__number">7</span> <h3 class="gameboard__screen__question__heading"> background-color: rgb(225, 255, 0); </h3> </div> </div> <div class="gameboard__screen__wrapper"> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">a</span> <p class="gameboard__screen__answer__body"> Changes the box's background color </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">b</span> <p class="gameboard__screen__answer__body"> Changes the box's width </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">c</span> <p class="gameboard__screen__answer__body"> Changes the box's position </p> </label> </div> </section> <section class="gameboard__screen"> <div class="gameboard__screen__wrapper"> <div class="gameboard__screen__question"> <span class="gameboard__screen__question__number">8</span> <h3 class="gameboard__screen__question__heading"> What is the purpose of position: relative; in the .box style </h3> </div> </div> <div class="gameboard__screen__wrapper"> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">a</span> <p class="gameboard__screen__answer__body"> It makes the box invisible </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">b</span> <p class="gameboard__screen__answer__body"> It automatically makes the box circular </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">c</span> <p class="gameboard__screen__answer__body"> It allows the element to be positioned relative to its normal position </p> </label> </div> </section> <section class="gameboard__screen"> <div class="gameboard__screen__wrapper"> <div class="gameboard__screen__question"> <span class="gameboard__screen__question__number">9</span> <h3 class="gameboard__screen__question__heading"> What is the purpose of @keyframes circle </h3> </div> </div> <div class="gameboard__screen__wrapper"> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">a</span> <p class="gameboard__screen__answer__body"> It creates the HTML document </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">b</span> <p class="gameboard__screen__answer__body"> It defines the steps or changes of the animation </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">c</span> <p class="gameboard__screen__answer__body"> It connects the CSS file to VS Code </p> </label> </div> </section> <section class="gameboard__screen"> <div class="gameboard__screen__wrapper"> <div class="gameboard__screen__question"> <span class="gameboard__screen__question__number">10</span> <h3 class="gameboard__screen__question__heading"> What does 1s mean in the animation code? </h3> </div> </div> <div class="gameboard__screen__wrapper"> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">a</span> <p class="gameboard__screen__answer__body"> Rotates the box 300 degrees </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">b</span> <p class="gameboard__screen__answer__body"> Moves the box 300 pixels to the right from its relative position </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">c</span> <p class="gameboard__screen__answer__body"> Moves the box 300 pixels to the right from its normal position </p> </label> </div> </section> <section class="gameboard__screen"> <div class="gameboard__screen__wrapper"> <div class="gameboard__screen__question"> <span class="gameboard__screen__question__number">11</span> <h3 class="gameboard__screen__question__heading"> The heading is not appearing as the main heading. Which code should be used? <h2>MY FIRST ANIMATION</h2> </h3> </div> </div> <div class="gameboard__screen__wrapper"> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">a</span> <p class="gameboard__screen__answer__body"> <h1>MY FIRST ANIMATION</h1> </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">b</span> <p class="gameboard__screen__answer__body"> <title>MY FIRST ANIMATION c MY FIRST ANIMATION 12 The CSS file is named firstanimation.css, but the webpage is not using the CSS. What should you check? a Change stylesheet to animation b Change animation.css to firstanimation.css c Change animation.css to myfirstanimation.css 13 The student wants the box to move farther to the right. a Change 150px to 150deg b Change 360px to 360deg c Change 360px to 360s 14 The CSS animation is not working because the keyframes name doesn't match. .box { animation: square 1s linear infinite; } @keyframes circle { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } a hange square to circle b Change animation to keyframes c Change square to circle 15 The animation is not working because the student forgot @keyframes. Which code correctly defines the animation? a @move circle { 0% { transform: rotate(0deg); } } b @animation circle { 0% { rotate: 0deg; } } c @keyframes circle { 0% { transform: rotate(0deg); } } 16 Why can’t I make my website public using Netlify? a You need to pay for the website b You need to pay for the website c The file name needs to be changed to index.html 17 Which language is primarily used to structure the content of a webpage? a HTML b CSS c JavaScript 18 Which language is used to style a webpage, such as changing colors, fonts, and layouts? a CSS b HTML c JAVA 19 Which language is commonly used to add interactivity and animations to a webpage? a HTML b Javascript c CSS 20 A student finds that their program produces an incorrect result even though the program runs successfully. What should the programmer do first? a Debug the program and check the logic b Reboot the computer c Delete the program 21 Which statement best describes programming? a The process of connecting computers to the internet b The process of creating instructions that a computer can execute c The process of designing computer hardware 22 Which best describes the role of a programmer in software development? a Only designing computer hardware b Writing, testing, debugging, and maintaining code c Only installing applications 23 Is a software application that provides tools for writing, editing, running, and debugging programs. a Integrated Development Environment b International Development Environment c Interactive Development Environment 24 It is a step-by-step procedure used to solve a problem or accomplish a task. a Algorithm b Syntax c Error 25 is the process of finding and correcting errors in a program. a Debugging b Syntax c Errors

Vous pouvez intégrer le jeu dans un LMS compatible avec LTI 1.1 ou LTI 1.3 comme Canvas, Moodle ou Blackboard. Les scores seront ainsi automatiquement enregistrés dans le carnet de notes de la plateforme.

VS CODE SIMPLE ANIMATION

Froggy Jumps

À propos de cette activité

Créé par

Téléchargez la version pour jouer sur papier

Top Jeux

Froggy Jumps

Phlebotomy Order of Draw Quiz

Froggy Jumps

The Integumentary System

Froggy Jumps

Ethos, Pathos, and Logos Quiz

Froggy Jumps

Bill of Rights Game - The Constitutionalist

Froggy Jumps

pizza

Froggy Jumps

VS CODE SIMPLE ANIMATIONVersion en ligne

par belle

1. What is the main purpose of HTML in the website created yesterday?

Which HTML tag is used to create the main heading “MY FIRST ANIMATION”?

The CSS file is named firstanimation.css, but the webpage is not using the CSS. What should you check?

The student wants the box to move farther to the right.

The CSS animation is not working because the keyframes name doesn't match. .box { animation: square 1s linear infinite; } @keyframes circle { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }

The animation is not working because the student forgot @keyframes. Which code correctly defines the animation?

Why can’t I make my website public using Netlify?

Which language is primarily used to structure the content of a webpage?

Which language is used to style a webpage, such as changing colors, fonts, and layouts?

Which language is commonly used to add interactivity and animations to a webpage?

A student finds that their program produces an incorrect result even though the program runs successfully. What should the programmer do first?

Which statement best describes programming?

Which best describes the role of a programmer in software development?

Is a software application that provides tools for writing, editing, running, and debugging programs.

It is a step-by-step procedure used to solve a problem or accomplish a task.

is the process of finding and correcting errors in a program.