Introduction

HTML is a markup language. It does not contain any logic so therefore it is not technically a programming language. But every page on the internet uses HTML as the base of the page so it is still good to learn. HTML is all based on tags. There is always an opening tag that has an opening bracket and a closing bracket after the tags name.

CSS or Cascading Style Sheets is a language used to style your HTML. Once again CSS is not technically a programming lanugage, but it is also used on almost every good looking webpage on the internet. The basic principle of CSS is that it defines an element and then a style. For example if I wanted a header with the text green I would say:

header{
color: green;
          }
What You Should Know
  • You are in luck, no other coding knowledge is necessary!
Hello World

Hello World projects are very simple projects. There is usually Hello World projects for every language. Most of the projects in web development is displaying text. Here are some examples:

  • HTML H1 tags displaying Hello World
  • Javascript Hello World Project:
    console.log("Hello World");

This would display Hello World in the webpages console.

Selecting Elements

In CSS before styling a piece of the webpage you must call the element that you want to style. You can choose any element. You can do this by ID by adding a # before the name of the element you want to style like this:

#myId{
what I want styled: style;
          }

    Many things can be added as a style including:

  • Padding: The amount of space an element has around it.
  • Color: The color selector basically acts as a font-color selector.
  • Background-color: This will change the color of your background.
  • Text-align: This value will change where and how the text is aligned.
Making an Element

To make an element in HTML you need to start the tag and end the tag. To start the tag you would make two angle brackets with the element name inside the brackets. To close the element it is a bit different.

It appears with the two angle brackets from before but instead you now make a forward slash before you say the element name agein.
Linking HTML and CSS

To make the CSS actually work on HTML elements they must be linked. There are three types of ways to write CSS.

  • Inline
  • Internal
  • External

Inline styling is writing the CSS in the HTML tag you want to style. Internal CSS is defined by the style tags and then writing the CSS inside of the style tags. To write external CSS you must make a separate CSS file in the format (anyname).css so the computer knows it is a CSS file. When linking the code you use the link tag. Inside this link tag you need to define the relationship of the document:

rel="stylesheet"

and you need to tell the computer the link to the CSS file:

href="(yourname).css"