WorksheetsCoding Final Exam CS 2026
Total questions: 312
Worksheet time: 4hrs 2mins
Which are examples of functions someone else might have designed?
write(message)
random(low, high)
while(true) {}
if(true) {}
Which of the following is the correct way to create a function named foo in JavaScript?
foo( )
function == foo( ) { }
function:
foo( )
function foo( )
{ }
What do we call it when you use a function many times after it has been designed?
Defining
Passing
Calling
Parameter
c.draw();
c is a circle object
.draw() is an example of?
argument
parameter
method
class
How many parameters does the function design have?
0
1
2
3
What is the name of the function?
name
function
printNameTwice
background()
// what is distance in this function declaration?
function chaseZombie(distance) { }
always an object
return value
a for Loop
parameter
A value of 3 is passed into a function
Example: we call the function
move ( 3)
What is the 3 inside the parenthesis?
argument
class
Declaration
Method
A function can return something when execution is complete.
The return is best described as
Input
result
Function
Loop
we called function moveDistance(x)
x is an argument that is best described as....
Constant
Factor into the function
Assignment
Input into the function
move(distance)
to make the move() function work you
pass in one _____________,
system
boolean
loop
Value
The design of your function can receive multiple _________ to get data.
Systems
Parameters
Conditions
Loops
When ship.draw() is a function attached to an object
Parameter
Instance
Method
Type
Which statement allows a function to exit and give something back to the code that called it?
which(exit)
return x
immediate
back(x)
What is the purpose of a return statement in a function?
Stops executing the function and returns a result
Returns the program back to the start of the function
Make a statement and run all code that remains in the function
always return back what you received
How many return values come out of the function sum?
function sum(first, second){
var result = first + second;
return result;
}
0
1
2
3
How many return values come back from calling collide?
touch = collide( human, zombie)
1
2
3
4
function divide(n, denominator){
var result = n / denominator;
return result;
if ( denominator== 0 ) { write("warning, divide by zero") }
}
This code never warns the user
the warning should come first
we should not attempt the divide if we give a warning
The code will always work
function myArea(h, w) {
var area= 3*5 ;
return area;
}
answer1 = myArea(3,5);
answer2 = myArea(3,8);
the function design is correct
the bug causes all returned areas to be equal
the calls to the function are correct.
h and w should be used to assign area
function vennDiagram(x,y,size) {
// two circles touching on the same horizon, not in the same spot
circle( x, y, radius);
circle(x, y, radius ) ;
}
Where is the bug above?
The second circle y value should increase
the second circle should increase x , but not more than radius
the second circle with x incremented by 100
only a 3rd circle will call this correctly.
Computer Science functions
organize our code
have a name to describe their action
avoid repeating blocks of code
always use more frames
always use more memory
How many parameters in the declared function?
0
1
2
3
// call function
result = myRandom(1,6)
// this uses two _______
Results
Arguments
Conditions or Loops
Systems
Select 2: What is the purpose of a function design?
to design an action you need to run many times
To store information for later.
To store word data for the computer to use.
to never use code
How many arguments are in the function design?
1
2
3
4
Use hints in the code to match
not arguments
A human designs a function to take 3 of these:
parameters
not parameters
You call a function and give it 3 of these:
arguments
3rd parameter
size
3rd argument when calling function donut()
75
2nd parameter
y
It is normal to mix up the vocabulary arguments and parameters. For example function donut(x,y,size) where x is a parameter in the design and 100 when you call donut(100, 200, 25)
True
False
Don't click me, click true
Hint, do not click false.
Programming is when humans write computer instructions
true
false
A computer needs correct syntax to understand code
True
False
_______ are the rules for writing code
Syntax
Loops
Variables
Functions
variables have names
true
false
optional
A _________ holds your data for later
syntax
Expression
Variable
Value
A variable is just a _____ for storing a____
constant; value
container; value
constant; variable
container; variable
What is the purpose of a variable?
To store data, and give it a name for later use
To replace numbers
To make algebra work
show the x axis or y axis
The operator to assign values?
==
<==
=
new
______ is a type of data that represents text
Basic
Syntax
Argument
String
Words that signal to the computer that you are about to create a variable in Javascript or Java ?
var
con
constant
new
class
function
score
x
y
javaScript
coding language
variable
data storage
10
a number value of ten
=
assignment operator
"10"
A string value "10"
what can we store in a JavaScript variable?
food storage
example
tupperware
strings
example
"abc"
objects
example:
new Circle()
boolean
example:
true
numbers
example
3
Select 2: Why create variables with precise names?
Write code understandable to others or yourself later in time
Avoid duplicate names or reserved words in a language
Create long names as a form of cryptic encoding
Short names are always bad
join a string "your heath points: " with variable hp
concatenation
+
++
merge
var s = "1";
var i = "3";
var t = s + i;
// what is stored in variable t?
(a)
print( "health points: " + hp );
// what describes the + operator?
+
syntax error
+
add hp points
+
increment points
concatentation
radius is a property of what?
Circle object
Circle and Rectangle
Image
Image and Circle
The screen area where JavaScript circles can be drawn on screen
canvas
area
radius
HD
coordinates that best match the red dot in the image
canvas.width/2
,
canvas.height/2
canvas.width
,
canvas.height
(y,x)
axis_y, axis_x
var planet = new circle();
planet.draw()
//are there bugs here?
must use animate
missing x,y values
Make C
in Circle
UPPERCASE
missing radius
dot.draw()
// what is .draw() most like?
noun
verb
adjective
doing
nothing
alien = new image();
alien.x = 200;
alien.y = 200;
alien.name = "monster1.png";
monster.draw();
// what code revisions fix the bugs above
alien = monster.png
draw image()
var alien= new Image()
alien.draw()
("alien.png")
what clue shows x is assigned a literal string value 3
quotes
"3"
var = new Literal
colon
3: 3
var x = syntax
Defining variable for the first time.
Declare a Variable
Variable
Console
readLine
var ship = new Circle(40,40);
ship.radius = 30;
30 is a value
ship is an object
radius is a property of ship
objects are properties
var ship = {
shields: 40,
seats: 10,
fuel: 0,
}
40 and 10 are properties
seats is a property
there are 4 properties
40 and 10 are values
var morgan = {
eyeColor: "brown",
age : 10,
walletValue: 0,
}
age and eyeColor
properties
zero && brown
values
object name
morgan
var x = {}
declare object literal x
var pat = {
humor: "good",
age : 40,
pronoun: "they",
}
they good
values
object name
pat
humor, pronoun
properties
var x = {}
declare object literal x
What syntax compares using "Equal to" ?
=
==
!=
>=
What syntax compares using "Not equal to" ?
=
==
!=
>=
x = 3
assign 3 to x
health == 4
compare
health to
4
==
comparison
operator
=
assignment
operator
boolean
true or false
var age = 17;
if ( age > 17 ) {
print("you are old enough to vote);
}
Testing a condition
True condition
Always true
var yourHealth = 0;
var yourFood = 1;
if ( yourHealth < 1 | | yourFood < 1 ) {
print("you are dead");
}
Testing two conditions
You are dead
you are alive
if ( x > 200 && y > 200)
True when 100 is value of x
compound condition testing x and y
true when 100 is value of y
true if 0 is the value of x and y
Conditionals let your program
Repeat code to increase efficiency
Make decisions to follow a different path
Run in the right order
Give a set of commands a custom name
Match the coding syntax
and
&&
or
| |
not
! =
compare
= =
assign value
=
Mark all items that are evaluated as true
var lunchOver = true;
or
var foodSpoiled = false;
var lunchOver = false;
or
var foodSpoiled = true;
var lunchOver = true;
or
var foodSpoiled = true;
var lunchOver = false;
or
var foodSpoiled = false;
Your condition uses the AND and NOT operators
Mark which data shows true overall
if ( !lunchOver && foodHot )
var lunchOver = true;
var foodHot= false;
var lunchOver = false;
var foodHot= true;
var lunchOver = true;
var foodHot= true;
var lunchOver = false;
var foodHot= false;
Errors when programmers making typing mistakes or spelling mistakes
Compile error
Syntax error
Logic error
debug
Error when human algorithms or calculations or results are wrong and the code still runs
Syntax
Syntax error
Logic error
debug
The term which describes the rules that govern a computer language, how it is structured and written.
Syntax
Syntax error
Logic error
bug
debug
What are runtime errors?
This type of error occurs during the execution of a program.
This type of error occurs during the addition of new code.
This type of error occurs during the execution of the national anthem.
// Why add comments to code?
// more than one is true!
retain the code tips for yourself
explain code to others
disable code for a moment of problem solving
All true:
Syntax: Leave a comment in code by starting the line with _____
//
blanks
indent
$
Programmers use comments to:
debug issues in code
document how code was written for other programmers to use
decide which components are important to use
An advantage to using comments in your code is:
It makes your code run better
It runs the code in slow motion, step by step
it describes parts of your code so others can understand it or improve it
comments are necessary in order to call a function
Comments show the exact location of bugs.
Comments are optional
Comments can disable code temporarily.
// comment
var x = 0;
Form of program documentation written into the program to be read by people.
Comment
Documentation
Input
Output
What did the grey hair person put in their code?
This explains the finished project.
The answer is: comments
(a)
Giving variables clear names creates code that documents what is happening and helps other programmers understand your code
False
True
Decoy
do not click me
A human codes a loop, but the loop does not run as expected. Possible coding errors for loops are:
Loops one too few times
Loops one too many times
Never stops looping
Fails to loop even once
JavaScript loop
if(x<10)
for( var x=0; x<10; x++)
{}
var x=10;
loop(x,10;10)
Repeat something 10 times
repeat 10
for (var i=0; i<=9; i++)
repeat { } until 10;
for (var i=1; i<=10; i++)
Loops use these to eventually exit the loop
Numbers and letters
conditions with logic and comparison
class or ID
input from the keyboard
This loop starts counting down from 10
for(var i=10; i>0; i--)
var i = 10;
count=10;
for(var i=0; i>0; i--)
adds one to variable x in a loop
increment (x)
x++;
x=x;
y+1;
Run code many unknown cycles as long as condition remains true
When loop
Condition loop
while loop
Parentheses loop
loop runs code a specific or set number of times
When
Condition
for
Parentheses
Why are the curly braces { } needed for loops?
To tell the program where the loop begins and ends
To tell the program when to exit the loop
To declare a new variable
use [ ] and code runs faster
loops make computers go faster
what is the __ missing in this loop
for ( ____ ; x<10; x++);
set a start value for x
exit the loop when x is 11
start x at zero
the loop is not missing code
The proper way to code a loop condition
Starts TRUE and later changes to FALSE
Loop
Starts FALSE and stays FALSE
Starts FALSE and turns TRUE to exit the loop
What output is produced by the following segment of code:
for (int i = 0; i < 12; i++)
ouput(i)
0 1 2 3 4 5 6 7 8 9 10
0 1 2 3 4 5
6 7 8 9 10 11
1 2 3 4 5 6 7 8 9 10
1 2 3 4 5 6 7 8 9
Infinite Loop
To repeat a fixed number of times use a
while loop
if loop
for loop
indentation
To repeat as long as something remains true?
while loop
if loop
for loop
indentation
In programming, what is iteration?
The repetition of steps within a program
A decision point in a program
The order in which instructions are carried out
Testing a program to make sure it works
Which two statements are used to implement iteration?
IF and WHILE
FOR and WHILE
ELSE and WHILE
IF and ELSE
The condition for a while loop to continue could include which of the following?
While something equals something
While something is greater than something
While something is True
All of these
To leave a WHILE loop
the condition must be true
the condition must change from true to false
the code must be commented
the nested code must be three lines long
Repeat something 10 times
repeat 10
for (var i=0; i<10; i++)
repeat { } until 10;
while (i = 10)
Why is iteration important?
It determines the order in which instructions are carried out
It allows multiple paths through a program
It allows code to be simplified by removing duplicated steps
It ensures the code works correctly
What is loop j inside an outer loop?
for (var counter = 0; counter <= 12; counter++) {
for (var j = 0; j < 6; j++) {
write( eggs[ counter ][ j ] );
}
}
nested
birded
feathered
botched
// tip: read this loop template slowly
for ( initialize counter ; test condition ; increment or decrement)
{ code }
initialize
counter
declare a variable and starting value
test condition
Your loop only runs if the condition is tested true
increment
decrement
the loop counter goes up or down by a given number
free match 1
free match 1
code
iteration
the code a programmer needs to be repeated
A human codes a loop, but the loop does not run as expected. Possible coding errors for loops are:
Loops one too few times
Loops one too many times
Never stops looping
Fails to loop even once
JavaScript loop
if(x<10)
for( var x=0; x<10; x++)
{}
var x=10;
loop(x,10;10)
Repeat something 10 times
repeat 10
for (var i=0; i<=9; i++)
repeat { } until 10;
for (var i=1; i<=10; i++)
Loops use these to eventually exit the loop
Numbers and letters
conditions with logic and comparison
class or ID
input from the keyboard
This loop starts counting down from 10
for(var i=10; i>0; i--)
var i = 10;
count=10;
for(var i=0; i>0; i--)
adds one to variable x in a loop
increment (x)
x++;
x=x;
y+1;
Run code many unknown cycles as long as condition remains true
When loop
Condition loop
while loop
Parentheses loop
loop runs code a specific or set number of times
When
Condition
for
Parentheses
Why are the curly braces { } needed for loops?
To tell the program where the loop begins and ends
To tell the program when to exit the loop
To declare a new variable
use [ ] and code runs faster
loops make computers go faster
what is the __ missing in this loop
for ( ____ ; x<10; x++);
set a start value for x
exit the loop when x is 11
start x at zero
the loop is not missing code
The proper way to code a loop condition
Starts TRUE and later changes to FALSE
Loop
Starts FALSE and stays FALSE
Starts FALSE and turns TRUE to exit the loop
What output is produced by the following segment of code:
for (int i = 0; i < 12; i++)
ouput(i)
0 1 2 3 4 5 6 7 8 9 10
0 1 2 3 4 5
6 7 8 9 10 11
1 2 3 4 5 6 7 8 9 10
1 2 3 4 5 6 7 8 9
Infinite Loop
To repeat a fixed number of times use a
while loop
if loop
for loop
indentation
To repeat as long as something remains true?
while loop
if loop
for loop
indentation
In programming, what is iteration?
The repetition of steps within a program
A decision point in a program
The order in which instructions are carried out
Testing a program to make sure it works
Which two statements are used to implement iteration?
IF and WHILE
FOR and WHILE
ELSE and WHILE
IF and ELSE
The condition for a while loop to continue could include which of the following?
While something equals something
While something is greater than something
While something is True
All of these
To leave a WHILE loop
the condition must be true
the condition must change from true to false
the code must be commented
the nested code must be three lines long
Repeat something 10 times
repeat 10
for (var i=0; i<10; i++)
repeat { } until 10;
while (i = 10)
Why is iteration important?
It determines the order in which instructions are carried out
It allows multiple paths through a program
It allows code to be simplified by removing duplicated steps
It ensures the code works correctly
What is loop j inside an outer loop?
for (var counter = 0; counter <= 12; counter++) {
for (var j = 0; j < 6; j++) {
write( eggs[ counter ][ j ] );
}
}
nested
birded
feathered
botched
// tip: read this loop template slowly
for ( initialize counter ; test condition ; increment or decrement)
{ code }
initialize
counter
declare a variable and starting value
test condition
Your loop only runs if the condition is tested true
increment
decrement
the loop counter goes up or down by a given number
free match 1
free match 1
code
iteration
the code a programmer needs to be repeated
Why would you add comments to an If/else statement? Select multiple below:
it will run faster.
To store information for later.
Shows the end of the code for if/else
Help you and others know more about the condition evaluation
Why test code after writing a condition and if statement
The condition might not be true when you expect
Conditions can evaluate to a value between true and false
Testing code once is enough
makes it run faster
&&
||
!
comparison operators
logical operators
local server
parts of your Filezilla password
What symbols go around the condition in an if statement?
< >
[ ]
{ }
( )
What surrounds code run when an IF statement is TRUE?
< >
[ ]
{ }
( )
IF statements can have many conditional operators?
True
False
IF statements always results in TRUE or FALSE
Yes
No
<
===
>
==
<=
>=
comparison operators
logical operators
local server
Filezilla password
What statement evaluates a condition and only runs some code when the answer is true. (read this question slowly)
If/else statement
Condition
If Statement
When statement
Hint: Read slowly!
What statement evaluates a condition and runs one of two options a) code if true otherwise b) code if false
If/else statement
Condition
If Statement
When statement
Conditions return values of which data type?
Integer
boolean
floating-point
string
Which one of the following is NOT a logical operator?
||
&&
$$
Conditions return values of which data type?
Integer
boolean
floating-point
string
Pick one slowly:
Pat is a student who is age 15. Which of these evaluates to true.
if (name = "pat"
&&
age < 16 )
if (name == "Pat"
&&
age < 16 )
if (name = "pat"
||
age < 15 )
if (name == "pat"
||
age > 15 )
These evaluate something on the left and right of the operator
>
<
!=
=
==
Conditionals let your program
run faster
Make decisions to follow a different path
Run in conditions and results that never change
Give a set of commands a custom name
What is the significance of the if else statement?
It allows the code to choose between two paths based on a condition
It repeats a block of code multiple times
It defines a function
It creates a variable
it is always important
Check the value of code and branch to different paths
if ( condition )
Only runs if true
if (condition)
else
code if true
other code on false
switch ( )
limitless branching
An array is:
Shapes
Eggs
Options
List of data
Why is this storage a good example of an array
there are individual elements in the array
there are 5 days in a week
it protects the data from security risks
Arrays are segmented
What is first index value of an array?
-1
0
1
undefine
// lockers is an array
What is lockers.length ?
the number of elements in the array
The height of one locker
The sum of all lockers
A list of long lockers
Select 2 -Two are correct:
var foods = ["rice","beans","meat"];
Foods is a function
foods is an array
foods[0] == "rice"
foods[1] == "rice"
to make code faster
What syntax surrounds an array index zero?
Parenthesis ( 0 )
Curly Brackets { 0 }
Angle Brackets < 0 >
Square Brackets [ 0 ]
The push() method adds a new element to the end of an array
true
false
If one week is an array, what is the index of the last day?
-1
0
week.length
week.length - 1
array = [0,1,2,3,4,5,6]
// What is the length of this array?
6
7
5
0
Which definition below best describe an array?
An array is a function identifier that can hold more than one parameter.
An array is a beam of light.
An array is a special variable, which can hold more than one value at a time.
An array is a special function, which can hold more than one value at a time.
What is proper syntax for declaring a array in JavaScript?
var foods=[ ];
var foods[ ] ={ };
array foods={ };
obj var foods=[ ];
What is the highest position in this array?
HINT: Remember arrays start at position 0!
// what's the error?
var colors ["red","green","blue","dark"];
for (var i=1; i<4 ; i++) {
print( colors[ i ] );
}
red never shows
variable j should be used
dark is not part of RGB color systems
use primitive variables, not an array
What loop touches all elements in this array?
var days = ["su", "m", "t", "w", "th", "f", "sa" ] ;
for(var d = 0;
i <= d.length;
d++)
{ }
for(var i = 0;
i < days.length;
i++)
{ }
for(var i = 0;
i <= days.length;
i++)
{ }
for(var i = 0;
i < i.length;
i++)
{ }
days[0] is first of seven days
What is the last?
days[0]
days[5]
days[6]
days[7]
// arrays are reference variables
// wallet1 is an array
clone2 = wallet1;
a change to either is a change to both
anyone with access to clone2 can access your wallet1
You can change clone2 leaving wallet1 unchanged
Both reference the same data
Access all array e elements backwards?
for(int i = e.length - 1;
i > 0;
i--)
for(int j= e.length - 1;
j >= 0;
j--)
for(int k= e.length;
k> 0;
k--)
for(int i= e.length;
j >= 0;
k--)
What is returned by values[3]?
3
2
myArray = [10,20,30,40,50]
// We call the .splice() method to delete items
// what's the result after we call splice as:
myArray.splice(0, 1);
[20,30,40,50]
[10,20,30,40]
[50,40,30,20]
What does the 'float' property in web design allow you to do?
Lock an element in the center of the page
Change the color of an element
Reposition an element to the left or right and allow content to flow around it
Make an element disappear from the webpage
Which analogy best describes the 'float' property?
Drawing a picture on a piece of paper
Pushing a piece of paper to the left or right side of a table
Erasing content from a webpage
Stacking blocks on top of each other
What happens when you apply 'clear' to an element?
The element becomes transparent
The element cannot be placed next to a floating element
The element floats to the left or right
The element is deleted from the webpage
Which analogy best describes the 'clear' property?
Erasing a line from a piece of paper
Stacking blocks in a neat line
Pushing a toy car to the left
Drawing an invisible line across the page
If you want an element to appear below a floating element on the right, which 'clear' value should you use?
clear: left
clear: right
clear: both
clear: none
How does 'float' affect the flow of content on a webpage?
It hides the content behind the floating element
It allows content to wrap around the floating element
It makes content stack vertically
It locks the content in place
Which scenario would require using 'clear' in web design?
You want an image to float to the left
You want a text box to appear below a floating element
You want to change the font size of a paragraph
You want to add a background color to a webpage
What is the purpose of 'clear: both' in web design?
To allow an element to float on both sides
To prevent an element from being placed next to any floating elements
To make an element transparent
To delete all floating elements
Which statement is true about the 'float' and 'clear' properties?
'Float' locks elements in place, and 'clear' moves them
'Float' hides elements, and 'clear' makes them visible
'Float' repositions elements, and 'clear' controls how other elements interact with them
'Float' controls the stacking order of elements, and 'clear' changes their color
How can 'clear' be used to manage layout conflicts caused by floating elements?
By locking floating elements in place
By changing the size of floating elements
By forcing elements to move below floating elements
By making floating elements disappear
Match CSS properties and labels
flex
prohibited, removes skill students must prove fluency
float left
elements pushed left
float right
elements pushed right
clear both
no elements allowed to right
clear none
menus can be side by side if same class
To create large text what is allowed on our rubic
p or div with external css
< h2 >
< h5 >
< h1 >
<a> makes things clickable
<a> shows pictures on nike.com
Pictures of things
a paragraph
and pictures
What tag allows an HTML file to connect to a CSS file?
Hint: A bridge between the two files.
<html>
<link>
<href>
<a>
The best location for the link tag?
.
.
<link rel="stylesheet" type="text/css" href="a1.css">
<head>
<link>
</head>
<body>
<link>
<body>
<p>
<link>
<p>
<title>
link
</title>
What is the difference between HTML and CSS?
HTML is not compatible with browsers
CSS selects things and applies styles to HTML
CSS is not compatible with browsers
There is no difference.
What extension is at the end of your HTML file names?
.jpg
.index
.webpage
.html
What surrounds a property:value in CSS?
< >
[ ]
{ }
( )
What does HTML stand for?
HT Machine Language
Hyper Text Markup Language
Hardware Type Machine Language
Hardware TM Language
What is on line 6 and 10?
Selectors
properties
HTML
comments
body and #container selectors do what?
make red and green
target HTML with styles
Parenthesis
make a border color
Transfer Files to a web server
FTP
HTML
CSS
JavaScript
FTP moves your private HTML files to
Drive Y
remote public server
local server
Filezilla
Matching CSS selector
.container
#container
/div
container
<a> </a>
What should the first syntax be above?
<a src= >
< a href= >
dog.jpg
css
Which tags go around the entire HTML document?
<p>
<html></html>
<img>
<h1></h1>
Which CSS property changes the color of the letters?
text-color
textcolor
color
background-color
Which of the following is a proper cat image element?
<img src="cute_cat.jpg">
<imag src="google.com"
>
<a src="http://dog.jpg" />
img href="dog.jpg"
What tag makes the word dog clickable?
<a href="http://d.com>
dog
</a>
<link>
dog
</link>
<click>
dog.jpg
<click>
http://petsmart.com/
Choose the correct vocabulary word.
Indentation
Paragraph tag
Centered
Body element
Select multiple answers: Why would you indent a line of code.
Clarify a relationship to a parent object or line above
It looks great, teachers expect it, as does Python
Run one line of code
More easily see syntax or logic errors
What is the purpose of a comment?
To get the computer to say something out loud.
To store information for later.
To store word data for the computer to use.
To help you and other humans understand your code.
What should you test after an FTP upload?
Drive G
remote URL in browser
my.pps.net
Filezilla password
file: //G:/My Drive/Portland Public Schools/code_bobm/assignment4
Drive G local folder
remote server URL
server
Filezilla password
http://511.digitalfhs.com
Drive Y local file for 511
remote server URL for student 511
local server 511
Filezilla password for student 511
Why do coders use care when picking names for selectors?
make code faster
to delete data later
Because vague names may cause confusion.
Because specific names help avoid confusion.
connects your HTML file to your CSS file
<html>
<link>
<href>
<a>
Which selector targets only one element on a html page?
bluetext
<bluetext>
my text
</bluetext>
<select>
text
</select>
#bluetext
Used to change the font name
examples: Calibri , Times, Arial, Comic Sans MS
font-size
font-weight
font-family
font-style
<a href="">
</a>
#word
<p>
</p>
<anchor>
</anchor>
The correct use of an ID in HTML
<a>
</a>
#word
<div id="main">
</div>
<id>
</id>
Which item interprets the HTML source code in a web document?
Text editor
Web browser
HTML editor
Web server
Place an image inside another tag and...
and... please indent the img tag
and... img is the parent tag
and... it's called nesting the image
3 parts of CSS syntax in order:
property {
syntax :value;
}
selector {
property: value;
}
selector{
value:property;
}
variable {
property: value;
}
match the items
Syntax that connects
to an external style sheet
mandatory in our class
<link rel="stylesheet"
type="text/css"
Styles in the head section
apply to only one page
prohibited in our class
<head>
<style>
</style>
</head>
red paragraph
styled internally
external css not used
prohibited in our class
<p style=color:red >
Where should the CSS go?
In its own document
As an html attribute (inline)
On the moon
Anywhere.
What is something we can we use float on? (select all that apply)
link tag
img tag
A div tag
What is the CSS syntax?
selector { property:value; }
selector { property_value; }
selector { property?value; }:
Where in an HTML document is the correct place to refer to an external style sheet?
At the end of the document
In the <head> section
In the <body> section
Which CSS property is used to change the text color of an element?
fgcolor
text-color
color
myColor
Where is the bug?
Missing bracket
Spelling error
Wrong selector
px for pixels should be percent
If you want to control space outside the edge of an element?
Margin
Padding
Spacing
What property puts more space INSIDE an element edge and items inside that element?
Padding
Margin
Width
The problem with this code?
indenting issues
file extensions wrong
Missing a comment
illegal images
Which one is a PROPERTY?
width:
1000px;
#wrapper
Line 24
After you fix your code
Save and
Reload in chrome
Never save until the end of class
Change to the browser and don't save
You just used Filezilla to upload files
You open your public URL but can't see new changes
... you must hold shift and reload to clear the cache
assume the system is broken and wait for help
ignore videos that tell you to save and shift reload
Look at the picture and
mark the true items
h1 selectors and tags are not allowed in our classwork
belongs in .HTML file
The blue text is called a(n) _____________
Declaration
Selector
Property
Value
The blue text is called a(n) _____________
Declaration
Selector
Property
Value
The blue text is called a(n) _____________
Declaration
Selector
Property
Value
p {color: red;}
{ }
curly brackets
Which is the property in this CSS?
p {color: red;}
{ }
curly brackets
Which is the selector in this CSS?
p {color: red;}
{ }
curly brackets
keyboard shortcut to quickly add a comment
ctrl + /
ctrl + s
ctrl + o
slowly type these 13 keys
/* comment */
You update HTML code in the sublime editor
then you need to test your code
right click
open in browser
ctrl + s
ctrl + /
run google drive
Which CSS property do you need to add a little space around the outside of an element?
Float
Clear
Padding
Margin
Which CSS property do you need to put a little space INSIDE a layout element to keep the text from touching the edges?
Float
Clear
Padding
Margin
Which values add up to be the total amount of space an html element takes on screen?
Width
padding
Border
margin
All of these
Which declaration will keep the green element on it's own line?
float: left;
clear: none;
float: left;
clear: both;
width: 80%
flex: max;
What is the correct way to join two files?
external CSS file and
HTML file
use <join> element
save both files with similar names
Use a link tag in head with href
Import CSS with a script src
Which selector targets a unique element by its identifier?
Type selector using tag name
Class selector using dot notation
Universal selector with asterisk
ID selector using hash symbol
What is the best practice for code indentation in HTML?
Indent child tags consistently
Indent only opening tags
Avoid indentation entirely
Indent randomly for speed
Which statement about comments is correct for this assignment?
Use comments to label the ending pair of a div
Comments should be avoided completely
Only CSS should have 15 comments
Comments must be uppercase letters
failure to comment can lead to headaches later
Which file and folder naming rule aligns with the rubric?
Include special symbols in names
No uppercase letters in names
Change names after saving to drive
Use spaces in folder names
What does proper tag nesting mean?
Placing tags anywhere freely
Using only self-closing tags
Opening tags out of sequence
some tags have extra space on the left, like an indented paragraph in English class
There is a visual hint if something is inside a parent tag
Which CSS property group shows layout spacing work?
Padding, margin, background
Animation, filter, z-index
Border, transform, cursor
Font-style, text-shadow, list
For a div added to assignment 2, which standard is expected?
Avoid divs in modern HTML
Use deprecated attributes often
Place div within head section
Use at ten words, in the div
there should be good looking padding and margins
What is required for naming files per teacher requests?
your web page is named index.html
Use random names and extensions for creativity and extra credit
Ignore canvas modules
CSS files end with
.css
HTML files end with
.html
Match the rubric level to its description.
Highly Proficient
Link and CSS working, well indented
Proficient
CSS working, one indent error
Close to proficient
Link tag broken or outside head
Developing
No link tag or styles applied
Match
External CSS linking to your other HTML file
Use link tag
use id=container in HTML
Use #container in CSS
Indent code consistently
Child tags indented
A folder name contains uppercase letters. What score impact is likely?
Bonus for readability
No change to rubric score
Lower due to naming errors
Higher for stylish naming
TRUE or FALSE: If you give a div a background color in the CSS you can see it immediately on the webpage.
TRUE
FALSE
it depends
Which naming system would you use if you want to name multiple HTML elements the same thing?
id
class
you can use both class and id
you can't use either class or id
Which naming system would you use if
you want to name ONLY ONE HTML element?
id
class
you can use both class and id
you can't use either class or id
What symbol do you use when you are styling class in the CSS?
. (period)
# (hashtag)
you do not use a symbol, you just say the name of the class
What symbol do you use when you are styling ID in the CSS?
. (period)
# (hashtag)
you do not use a symbol, you just say the name of the ID
What property puts more space INSIDE an element edge and items inside that element?
Padding
Margin
Width
After you fix your code
Save and
Reload in chrome
Never save until the end of class
Change to the browser and don't save
Which declaration will keep the green element on it's own line?
float: left;
clear: none;
float: left;
clear: both;
width: 80%
flex: max;
What property is used to specify what should happen with the element that is next to a floating element?
float
clear
box-sizing
overflow
With _______, an element can be pushed to the left or right, allowing other elements to wrap around it.
CSS Float
CSS z-index
CSS position
CSS display
an element can only be floated _______ or ______
top or bottom
left or right
up or down
adjacent and parallel
valid syntax for DIV clear syntax
right
left
none
both
This youtube video of TobyOnline
it explains css float
Match below:
red div
only div floating
may cover up green div
green, blue, yellow
divs not floating
true
your browser is like a 3d world
false
your browser is one dimensional
This youtube video of TobyOnline
it explains css clear
Match below:
yellow div
this div uses float and clear to have it's own space on the left
red div
this div does not clear right
true
the browser
is 3d
false
browser is one dimension
Chrome does not show the changes you saved in Sublime HTML/CSS
What keyboard shortcut is a full hard reload
Shift + F5
Crtl + S
F5
Ctrl + R
Which one of these is a Creativity Technique?
Brainstorming
Asking a friend
Pondering
Looking up the answer
Did your teachers in Elementary School enhance your Creative Thinking skills?
Your score will not change with your answer.
Yes
No
This type of thinking involves creating something new or original.
Creative Thinking
Video Game playing
Critical Thinking
Worksheets
what is a happens if you don't assume things about the current situation or future course of events.
Meta-questioning
backwards thinking
Researching,
Question
Assumptions
What is a riddle?
A type of poem that tells a story.
A puzzle to be solved with creative thinking.
A simple question with a straightforward answer.
A mathematical problem that requires calculation.
What is a common structure of a riddle?
A riddle often consists of a straightforward question with no clues.
A riddle typically includes a question or statement that presents a scenario, followed by clues that lead to the answer.
A riddle is usually a long narrative with multiple characters and settings.
A riddle is a simple yes or no question.
What is the purpose of riddles?
To entertain and amuse people
To challenge the mind, encourage creative thinking, and enhance problem-solving skills.
To provide straightforward answers to questions
To serve as a form of storytelling
What is a clue in the context of a riddle?
hint that helps you think in a creative way
A random statement that has no relevance to the riddle.
A question
A type of riddle that has no answer.
What does it mean to think creatively?
Using imagination and original ideas to solve problems or create something new.
Following established rules and guidelines to find solutions.
Relying on past experiences and knowledge to make decisions.
Avoiding new ideas and sticking to traditional methods.
Which of the following is NOT true about creative thinking?
copy/paste work
It is a result of hardwork
A set of steady, slow small changes to improve a project
Prepare, do the work, then verify
Stages of creative thinking are preparation stage, incubation stage, illumination stage, evaluation stage, and (a) stage
Which of the following is not a benefit of creative thinking?
Improves problem -solving capabilities
Creates effective bonding and teamwork
Boosts team morale and loyalty
None
Creative thinking can get a
affirmation, ( being positive with self/others )
journal keeping ( notebook )
and __?
Visualization/art/drawing
copy/pasting
internet searching
AI prompting
In this stage of creative thinking, this is where you take a break and take a step away from your thoughts.
Preparation stage
Incubation stage
Illumination stage
Evaluation stage
In what stage of creative thinking does hard work happens?
Preparation Stage
Incubation Stage
Evaluation Stage
Verification Stage
Puzzle.: Abigail, Oliver, Rosa, and Blake all attend the same summer camp, where they can cook, kayak, rock climb, and zip-line. Each has a different favorite activity.
Abigail’s favorite activity isn’t rock climbing.
Oliver is afraid of heights.
Rosa can’t do her favorite activity without a safety harness.
Blake likes to keep his feet on the ground at all times.
Who likes rock climbing?
Rosa
Abigail
Blake
Oliver
What are soft skills?
Technical abilities required for specific jobs
Personality-specific traits used to describe one's approach to life, work, and relationships
Hard skills that are measured by educational achievements
Skills related to physical labor and craftsmanship
Which of the following best defines creativity?
The ability to follow instructions without deviation
The skill of efficiently solving mathematical problems
The ability to develop original and useful ideas or solutions
The capacity to remember and recall large amounts of information
What is innovation primarily concerned with?
Preserving traditional methods and ideas
Taking a creative idea and developing a new method, product, or service
Repeating successful strategies without change
Focusing solely on economic gain without adding value
NOT a motivation for innovation throughout human history?
Necessity
Curiosity
Creativity
Competition
Which of the following is an example of innovation in the healthcare. Guess.
Video games playing online across the world
3D printing tech for medical devices
Games and virtual reality
Social media platforms
bypassing the Yondr policy
Key reasons for companies to think creatively and innovate.
This helps them make more money or make the world a better place for people, plants, and all organisms.
To create new and better products and services
To reduce the number of employees, cut costs, fire people, make cash!
To decrease marketing costs, less ad spending
To limit customer choices, make more profit
Solve problems that may harm us or ecosystems.
Why do employers value creativity and innovation skills in employees?
Because it helps in maintaining the status quo
Because it allows for a more hierarchical organization
Because it enables employees to solve complex problems
Because it reduces the need for teamwork
How can individuals contribute to their team and organization?
By following instructions without questioning
By showing they can contribute and that their skills are relevant
By avoiding new challenges
By working in isolation
What is a way to grow the skill of adapting to change, according to the video?
Avoiding new experiences
Sticking to what you know
Being unwilling to fail
Trying new things
What becomes possible when you bring a unique perspective and ideas to your classroom or family at home?
You become easily replaceable
You become a valuable team member
You hinder team progress
You create unnecessary competition
A result of students showing creativity in the classroom?
It discourages collaboration among employees
It leads to innovative solutions, free thinking and happiness.
It reduces the need for communication
It limits the growth of the organization
What is an example of skill that grows innovation?
Effective communication with elbow partners
coding alone at high speed
Mathematical perfection
absolute and precise AI prompting
How can organizations encourage employees to be more innovative?
By punishing mistakes harshly
By promoting a culture of experimentation and learning
By discouraging new ideas
By enforcing strict routines
Use some of our vocabulary to write 20 to 40 word essay about innovative project work and how it makes you feel.
vocab: teamwork, stuck, communication, persistent, consistent, creative, failure, trial and error.
________ is a key component of learning
money flow
speed
copy/paste
creativity
Creativity is the use of the _______ or original ideas especially in the production of an artistic work.
high speed technology
imagination
large vocabulary
internet
Creativity involves the use of our _____, and allows us to create new ______.
senses;
knowledge
brain;
thoughts
knowledge;
senses
knowledge;
education
Creativity is essential for _____ thinking
smart
critical
ideal
new
Whenever we try something ____ we are using creativity.
involving thinking
new
old
hard
Our students need to be prompted to think creatively, because it is a(n) _______ skill for life.
essential
unimportant
okay
unessential
When students are focused on a _____goal they will be absorbed in their learning and more driven to acquire skills.
creative
simple
common
active
the name given to inbound data when someone calls a function we are coding.
the name we give data that we pass to a function we call
An action that happens inside the function.
How many times you call the function.
a true statement if all parameters are zero
the name of data inside () when you call a function
The name of the function returned before you call it
In the design and declaration of a function it's the name of things inside the ( )