First and foremost, we need to make the backbone of our website, an HTML file. I made the HTML file and named it ‘index.html’. Since we'll be using CSS as well, in the same folder I made a CSS file, named ‘styles.css’. In the index.html, we need to give the following lines of code.
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="./styles.css">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Lato:wght@100;400;700&family=Poppins:wght@200&display=swap"
rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@200&display=swap" rel="stylesheet">
<title>Portfolio</title>
</head>
<body>
</body>
</html>
If you’re using VS Code and have an HTML extension installed, you just need to type ‘!’ and press enter. If you’re not, feel free to copy paste these lines. Discussing about them is not necessary, just know that they let the browser know you're trying to run a webpage. Also, they are importing all the CSS you'll be writing in 'styles.css'.
Now take a look at what we’re building.read more[][(https://www.codewithrandom.com/2021/12/simple-portfolio-website-using-html-css.html)]
Top comments (0)