- Open Visual Studio Code (Blue inifinity Symbol)
- Click File in the top left corner of your screen
- Click New File (Also can be done by Ctrl + N)
- Copy the following text into the window
<!DOCTYPE html>
<head>
<title>Pokemon Table</title>
<!-- <link rel="stylesheet" href="pokemon.css"> -->
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto+Slab&display=swap">
</head>
<body>
</body>
</html>
- Save your file (Recommend saving to Desktop) as index.html (You must save it as a .html file)
- Open a new file, and name it pokemon.css copy the subsequent text into it
body {
font-family: 'Roboto Slab', serif;
background-image: url("https://wallpapercave.com/wp/cqhO8rQ.jpg");
background-position: left bottom;
background-size: cover;
}
h1 {
text-align: center;
color: whitesmoke;
}
table {
border-collapse: collapse;
margin-left: auto;
margin-right: auto;
}
th {
background-color: #909090;
color: black;
}
tr:nth-child(even) {
background-color: #B4B4B4;
}
tr:nth-child(odd) {
background-color: #D4D4D4;
}
img {
width: 150px;
height: auto;
}
table, th, td {
border: 1px solid black;
}
th, td {
padding: 15px;
text-align: center;
}
- Celebrate your ready to start!