Web Development Reference Sheet

HTML Reference

Hover over a Tag to see an example, of how the code is written!

Tag Definition Required Attribute

<html>

<html>Your code goes here.</html>

 Used to define everything between its brackets that it
is HTML code. 		None

<head>

<head>Your metadata goes here.</head>

 Used to define the head area of a web page. Filled with
metadata (not specifically shown on the web page)		 None

<title>

<title>Webpage Name</title>

 Used to define the title of the webpage. Always located
in the Head tags. The title will be shown in the tab title.		 None

<body>

<body>Webpage content goes here.</body>

 Ussed to define the body of the website. (what is shown
on the page)		 None

<nav>

<nav>using an Ul you can create a navbar here.</nav>

 Used to create a navbar to navigate your website None

<h1-h6>

<h1>I am a Large Title</h1>

 Used to create different sized headings. h1 is biggest h6 is smallest None

<p>

<p>Put all of your text here. I am used to make a body of text.</p>

 Used to make bodies of text. None

<span>

<p>Now you can specifically assign <span>css to me.</span> More text.<p>

 Used to create a navbar to navigate your website None

<strong>
<em>

<p><strong>Im Bold</strong>
<em>Im Italicized</em><p>

 Used add bold or italics to certain text. None

<div>
<section>
<article>

<div>you broke up this area of your webpage</div>
<section>you broke up a bigger area of your webpage</section>
<article>you broke up an even bigger area of your webpage</article>

 Used to create sections in your html. It allows you to code sematically.
Acts like metadata and isn't directly shown on web page.		 None

<img>

<img src="./image.png" alt="this is an image"/>

 Used to add an image to your website/td> src, alt
Attribute Use Value
id Used as a selector for an element to be designed in CSS Name
class Used as a selector for an multipule element to be designed in CSS Name
src Used to add a source URL/File path to an element URL
alt Helps screen readers describe the image. Also appears when
the image doesnt load.		 image
discription