Core Code

Visual Studio Code

Application used to make these websites, here's a download link:


The main "language" websites are written in.

In Visual Studio Code (VSC), typing "html" in a .html file will open a prompt, pressing tab will autofill in the HTML:5 header.

Visual Studio Code

A separate .css file must be linked to a .html file to have an effect.

<link rel="stylesheet" href="../filename.css"> or
<link rel="stylesheet" href="../CSS/filename.css"> if you have a CSS Folder.

The "../" is the command to request access to a different file than the current one.

The "../CSS/" is the command to show that the requested file is in a different folder than the current file this code is written in.


Tags are the building blocks of HTML, each tag has its uses and formats that help structure websites.
they are written as <tag>Content</tag>, the "/" indicating the end of the tag.

<h#> or Header Tags vary from size 1 (largest) to 6 (smallest). </h#>

<p> are simple Paragraph tags. </p>

<ol> is an Ordered (numbered) List when combined with <li> tags inside of it. </ol>

<ul> is an Unordered (symbols) List when combined with <li> tags inside of it. </ul>

<head> Always the first tag in an HTML:5 document, this is where you link CSS and Bootstrap, and input a page Title. </head>

<body> Where everything else goes, making up the entirety of the web page. </body>

<div> Used to isolate parts of HTML for CSS, giving a class to a Div affects all tags inside that Div. </div>

<span> Used to further isolate Elements inside of Divs, putting this around an element can change how it appears </span>

<hr> does not have an End Tag, it works like pressing Enter in Word, but places a line in the gap.

<br> does not have an End Tag, works like pressing Enter in Word.

<img src="../nameOfImage.jpg" alt="Text if image doesn't load">

<a href="url to other website or link to other page"> The space between the Start and End tag can be text, Elements, or other Tags, making them able to be clicked on to activate the link. </a>


Elements are what is written inside of <Tags>.

Example code from Containers and Dividers
The Pale Blue, Pink and Green text in the image above are Elements, the Dark Blue is <Tags>, and the Yellow represents Attributes.


Attributes, like Classes and IDs, are included inside of a Tag in order to affect it with CSS.

<p class="topic"> is an Attribute used for this page to increase the Paragraph (p) font-size to 200%. </p>
Example Code for attribute
This is the CSS used to affect the class.