HTML
Find and fix the error in the following code:
<div>
<p> Pumpkin pie is the best type of pie ! <p>
</div>
Ending <p> tag needs a slash, so <p> → </p>
What are the possible results of this code?
Math.floor(Math.random()*3)-1
-1, 0, 1
To center the frog horizontally in the pond, which property and value should be used?
justify-content: center;
Fill in the blank to link the HTML to the CSS:
<link rel="----------" href="---------">
stylesheet; style.css
This HTML tag is used to insert a line break in text, allowing content to continue on the next line without creating a new paragraph.
What is <br>?
What will the following code output?
<ul>
<li>Go to school</li>
<li>Eat dinner</li>
<li>Go to sleep</li>
</ul>
Go to school
Eat dinner
Go to sleep
I want to change my element with id=“x” to say “hello”. What is the problem with my code?
document.getElementById(“x”) = “hello”;
Must add .innerHTML
Why is this CSS rule not applying a border to the image?
img {
border: solid 5px;
}
The border color is missing. It should be specified, such as border: solid 5px black;
<a>
What is the tag you use to add hyperlinks in HTML?
This CSS property is used to set the background color of an element. Complete the code below:
cssCopy code
What is background-color?
Identify the error in the code, and figure out a potential solution:
<div>
<p href="pumpkinpie.video">
Watch this video on pumpkin pie !!
</p>
</div>
You cannot directly put an href attribute into a paragraph tag. Instead, you could fix the code by doing:
<div>
<p>
Watch this <a href="pumpkinpie.video"> video </a> on pumpkin pie !!
</p>
</div>
Fill in the blanks so that this button calls myFunction() when it is clicked.
<button _________></button>
onclick = “myFunction()”
You want a grid item to span two columns, but it’s only appearing in one. Your CSS code is:
.item {
grid-column: span-2;
}
The correct property value is grid-column: span 2; without the hyphen
function checkEvenOdd(num) {
if (_____) {
return "even";
} else
{
return "odd";
}
}
what is num % 2 === 0?
This CSS property is used to hide an element, but it still takes up space in the layout. If you wanted to use JavaScript to toggle this property for an element with id="menu", you would write:
javascriptCopy code
What is visibility?
What does colspan=”2” do in the following code?
<body>
<table>
<tr>
<th colspan="2">Name</th>
<th>Birthday</th>
<th>Grade</th>
</tr>
<tr>
<td>John</td>
<td>Doe</td>
<td>10/24</td>
<td>11th</td>
</tr>
<tr>
<td>Jane</td>
<td>Doe</td>
<td>8/9</td>
<td>10th</td>
</tr>
</table>
</body>
The colspan=”2” makes the “name” heading take up 2 columns of space.
I am trying to create a function diff5(x) that returns the difference from 5 of any number x. For example, diff5(1) returns 4, diff5(-3) returns 8, diff5(7) returns 2, etc. However, my function doesn’t work for every number. Identify the problem and fix it. (Hint: there is more than one solution!)
function diff5(x){
var ans;
if(x > 5){
ans = x - 5;
}
if(x < 5){
ans = 5 - x;
}
return ans;
}
The problem is that ans is undefined for x = 5. Possible solutions: initialize ans to 0 at the beginning; change either ‘if’ statement to be <= or >=; change one ‘if’ statement to an else statement; add a third ‘if’ statement for x = 5.
This property is used to create space outside an element, pushing it away from neighboring elements.
margin
If wanted to insert an image with a link of "amongus.png", and I wanted the width to be "700" and the height to be "500", write the code that would make this happen.
<img src="amongus.png"
width= “700”
height= ”500”>
Write the HTML code to create a ordered list that represents a shopping list with the following structure:
<ul>
<li>Fruits
<ul>
<li>Apple</li>
<li>Banana</li>
</ul>
</li>
<li>Vegetables
<ul>
<li>Carrot</li>
<li>Lettuce</li>
</ul>
</li>
<li>Dairy
<ul>
<li>Milk</li>
<li>Cheese</li>
</ul>
</li>
</ul>
Fill in the blank tags to make an ordered list (Eg: 1. buy tomatoes, 2. do math homework, etc…)
<__>
<__>Buy tomatoes !<___>
<__>Finish math homework<___>
<__>Sleep by 9pm<___>
<___>
<ol>
<li>Buy tomatoes !</li>
<li>Finish math homework</li>
<li>Sleep by 9pm</li>
</ol>
Say you are creating a magic 8 ball program. You have an empty paragraph with id=”ans”. Build the function getAnswer() to have a 50/50 chance of changing the paragraph to say “Yes” or “No.” You will need to use an if/else statement and Math.random(). We have also challenged you to use a variable.
function getAnswer(){
var x;
if(______){
________
}
else{
_______
}
_________ = x;
}
function getAnswer(){
var x;
if(Math.random()<0.5){
x = “Yes”;
}
else{
x = “No”;
}
document.getElementById(“ans”).innerHTML = x;
*May vary slightly.
In Flexbox Froggy, you are tasked with making the frogs fill the entire width of the container, with equal space between each frog, but no space before the first frog or after the last frog. Write the CSS for the container to accomplish this layout.
.frogs {
display: flex;
justify-content: space-between;
}
You have a JavaScript function called checkTemperature that takes an integer parameter temp. The function should:
Write JavaScript code that: