i (can't) learn HTML!

I (can't) learn HTML! - a simple rundown for idiots

Index
oh

Introduction?

What is html?

From wikipedia: "Hyper Text Markup Language (HTML) is a markup language for creating a webpage. In easier words, HTML is a kind of programming language that can make a new webpage.(...)"

Most of this is more or less copypasta'd from W3schools (a much better place to read this exact stuff!), but in a very cut down and badly repasted on one page instead of fifty!
Any monkey that managed to keysmash their way to this website could follow along and somewhat understand what's going on.

It's not (entirely) laziness that led to this look. Modern web design can lick my ass!

The above mentioned excellent html resource here!

DOCTYPE

The < !DOCTYPE html > declaration defines that this document is an HTML5 document. it represents the document type, and helps browsers to display web pages correctly. It should only appear once, at the top of the page (before any HTML tags) as such:

< !doctype html >

This is not case sensitive whatsoever

The < html > element is the root element of an HTML page; meaning this is what defines what it should be read as

BODY

The < body > element defines the document's body, and is a container for all the visible contents, such as headings, paragraphs, images, hyperlinks, tables, lists, etc.

Never skip the end tag!

The end tag is the second tag that defines the end of what's inbetween the tags. ex. < p > text < /p >
some HTML elements will still display correctly despite leaving the end tag out.
However, never rely on this! weird results and errors may happen if you forget the endtag!

TITLE

The < title > element specifies a title for the HTML page (which is shown in the browser's title bar or in the page's tab)

HEADING

The < head > element contains meta information about the HTML page

HTML headings are defined with the < h1 > through < h6 > tags. < h1 > defines the most important/ largest heading. < h6 > defines the least important/ smallest heading

these headings look like such

This is heading 1

This is heading 2

This is heading 3

This is heading 4

This is heading 5
This is heading 6

PARAGRAPHS

The < p > element defines a paragraph.
There isn't much to this one, this is where you type all the stuff in!

TEXT STYLES

Bold text: < b >here's some bold text< /b >
Italic text: < i >here's some italicized text< /i >
Underline: < u >This text is underlined< /u >
Subscript: < sub >This is subscript text< /sub >
Superscript text: < sup >Here's some superscript text< /sup >
Typewriter text: < tt >Here is some typewriter-styled text< /tt >
Strike-Through text: < strike >This text has a line through it< /strike >

EMPTY ELEMENTS

HTML elements with no content are called empty elements.
The < br > tag defines a line break, and is an empty element without a closing tag

HTML LINKS

HTML links are defined with the < a tag

an example of a HTML link is is as such

< a href=https:// www. whatever site goes here .com >link text goes here < /a >

a link looks something like this.

the href attribute specifies the link's destination

Attributes provide additional information about HTML elements.

HTML Images (and GIFs!)

HTML images are defined with the img tag

you

Typing it out should look a little like this: < img src="banned.jpeg" alt=you just lost the game LOL width="300" height="300">

src is the source file; i.e. the image's location. alt is the alt text; which is what shows up if the image doesn't load for some reason

Defining the height and width is generally recommended, but not necessarily required to simply slap the image on to the page as above

LISTS

Here's how to make a list:
< ul > opens the list
< li > makes a bulletpoint in the list
< /ul > closes the list