A pizza restaurant is redesigning their website and want to display information about the three most popular pizzas — Margherita, Hawaiian and Pepperoni - Scottish Highers Computing Science - Question 18 - 2023
Question 18
A pizza restaurant is redesigning their website and want to display information about the three most popular pizzas — Margherita, Hawaiian and Pepperoni.
Part of the... show full transcript
Worked Solution & Example Answer:A pizza restaurant is redesigning their website and want to display information about the three most popular pizzas — Margherita, Hawaiian and Pepperoni - Scottish Highers Computing Science - Question 18 - 2023
Step 1
Write a simple CSS rule to apply the correct margins to all the h2, h3 and image elements on the web page.
96%
114 rated
Only available for registered users.
Sign up now to view full answer, or log in if you already have an account!
Answer
To apply the correct margins to all the <h2>, <h3>, and <img> elements, we can group them in a CSS rule as follows:
h2, h3, img { margin: 10px; }
Step 2
Complete the CSS rule below to correctly position the images to allow the pizza information and price to appear in the correct position.
99%
104 rated
Only available for registered users.
Sign up now to view full answer, or log in if you already have an account!
Answer
To position the images correctly, we can modify the CSS rule as:
Write the CSS rule needed to initially hide the description and price of the Margherita pizza.
96%
101 rated
Only available for registered users.
Sign up now to view full answer, or log in if you already have an account!
Answer
To initially hide the description and price of the Margherita pizza, the CSS rule should be:
#margInfo { display: none; }
Step 4
Complete the missing JavaScript code to allow the information to be displayed on the screen.
98%
120 rated
Only available for registered users.
Sign up now to view full answer, or log in if you already have an account!
Answer
The missing JavaScript code for the displayMyText function should be:
function displayMyText() {
document.getElementById("margInfo").style.display = "block";
}
Step 5
Write the missing line of the HTML code shown above to apply the JavaScript function from part (ii) to the image 'mPizza.jpg' when the user places their cursor over the image.
97%
117 rated
Only available for registered users.
Sign up now to view full answer, or log in if you already have an account!
Answer
The missing line of HTML code to apply the JavaScript function should be: