Modify styles.css so the provided HTML produces a webpa by adding the following CSS rules to styles.css: An ID selector for the ID game-table should: Use the border property to add a 2px solid border using the color from the CSS variable --table-color Use the text-align property to center all text Use a height of 200px and width of 400px A descendant selector that targets the <caption> inside the <table> should: Use the text-transform property to make the caption UPPERCASE Set the background color using the CSS variable --table-color Set the font color to white Add 10px padding A pseudo-class selector :nth-child(even) for <tr> should: Set the background color using the CSS variable --row-bg-color.   <!DOCTYPE html> <html lang="en"> <head> <title>Best-Selling Video Games</title> <link rel="stylesheet" href="styles.css"> </head> <body> <table id="game-table"> <caption>Best-Selling Video Games</caption> <tr> <th>Title</th> <th>Sales</th> <th>Release Date</th> </tr> <tr> <td>Minecraft</td> <td>176,000,000</td> <td>November 18, 2011</td> </tr> <tr> <td>Tetris</td> <td>170,000,000</td> <td>June 6, 1984</td> </tr> <tr> <td>Grand Theft Auto V</td> <td>110,000,000</td> <td>September 17, 2013</td> </tr> <tr> <td>Wii Sports</td> <td>82,870,000</td> <td>November 19, 2006</td> </tr> </table> <p> Source: <....</a> </p> </body> </html>

New Perspectives on HTML5, CSS3, and JavaScript
6th Edition
ISBN:9781305503922
Author:Patrick M. Carey
Publisher:Patrick M. Carey
Chapter4: Graphic Design With Css: Creating A Graphic Design For A Genealogy website
Section: Chapter Questions
Problem 4CP4
Question

Modify styles.css so the provided HTML produces a webpa by adding the following CSS rules to styles.css:

  • An ID selector for the ID game-table should:

    • Use the border property to add a 2px solid border using the color from the CSS variable --table-color
    • Use the text-align property to center all text
    • Use a height of 200px and width of 400px

  • A descendant selector that targets the <caption> inside the <table> should:

    • Use the text-transform property to make the caption UPPERCASE
    • Set the background color using the CSS variable --table-color
    • Set the font color to white
    • Add 10px padding

  • A pseudo-class selector :nth-child(even) for <tr> should:

    • Set the background color using the CSS variable --row-bg-color.
 
<!DOCTYPE html>
<html lang="en">
<head>
<title>Best-Selling Video Games</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<table id="game-table">
<caption>Best-Selling Video Games</caption>
<tr>
<th>Title</th>
<th>Sales</th>
<th>Release Date</th>
</tr>
<tr>
<td>Minecraft</td>
<td>176,000,000</td>
<td>November 18, 2011</td>
</tr>
<tr>
<td>Tetris</td>
<td>170,000,000</td>
<td>June 6, 1984</td>
</tr>
<tr>
<td>Grand Theft Auto V</td>
<td>110,000,000</td>
<td>September 17, 2013</td>
</tr>
<tr>
<td>Wii Sports</td>
<td>82,870,000</td>
<td>November 19, 2006</td>
</tr>
</table>
<p>
Source: <....</a>
</p>
</body>

</html>
AI-Generated Solution
AI-generated content may present inaccurate or offensive content that does not represent bartleby’s views.
steps

Unlock instant AI solutions

Tap the button
to generate a solution

Knowledge Booster
Image Element
Learn more about
Need a deep-dive on the concept behind this application? Look no further. Learn more about this topic, computer-science and related others by exploring similar questions and additional content below.
Similar questions
  • SEE MORE QUESTIONS
Recommended textbooks for you
New Perspectives on HTML5, CSS3, and JavaScript
New Perspectives on HTML5, CSS3, and JavaScript
Computer Science
ISBN:
9781305503922
Author:
Patrick M. Carey
Publisher:
Cengage Learning
Np Ms Office 365/Excel 2016 I Ntermed
Np Ms Office 365/Excel 2016 I Ntermed
Computer Science
ISBN:
9781337508841
Author:
Carey
Publisher:
Cengage