Introduction to html

Things we are going to discuss :

What is html ?
What is css ?
Html layout
Html elements and how we use them
Basic concepts of implementing a web page ( not an app )

What is html ?

HyperText Markup Language

HyperText is the method by which you move around on the web — by clicking on special text called hyperlinks which bring you to the next page.
Markup is what HTML tags do to the text inside them. They mark it as a certain type of text (italicised text, for example).
HTML is a Language, as it has code-words and syntax like any other language.

What is css ?

Cascading Style Sheets

div {
  width: 200px;
  height: 200px;
  background-color: red;
}
.class-name {
 width: 150px;
 border: 1px solid blue;
}
#some-id {
 height: 200px;
 background-color: #00ffdd;
}

HTML Layout

<!DOCTYPE html>
<html>

  <head>
    <title>Home</title>
    <meta charset="utf-8">
    <link rel="stylesheet" href="/font-awesome/css/font-awesome.min.css">
    <link rel="stylesheet" href="/css/main.css">
  </head>

  <body>
    <div>
      <p>
        this is a test
      </p>
    </div>

    <script src="dist/scripts/main.js"></script>

  </body>

</html>

HTML elements

<tagname>Content goes here...</tagname>

HTML elements

Divs
Paragraphs
Spans
Lists (ul ol )
List items
Nav

Basic concepts

No more theory