Lesson 3: Basic Concepts of HTML, CSS, and JavaScript

What Is HTML?

HTML (HyperText Markup Language) structures the content of your website.

  • It uses tags to define elements like headings, paragraphs, and images.

Example:

<!DOCTYPE html>
<html>
  <head>
    <title>My First Website</title>
  </head>
  <body>
    <h1>Welcome to My Website!</h1>
    <p>This is my first webpage. Stay tuned for more!</p>
  </body>
</html>

When you open this file in your browser, it will display:

  • A heading saying “Welcome to My Website!”
  • A paragraph below it.

What Is CSS?

CSS (Cascading Style Sheets) styles your HTML content. It controls colors, fonts, layouts, and more.

Example:
Add this to your HTML file to change the background color and text styles:

<style>
  body {
    background-color: lightblue;
    font-family: Arial, sans-serif;
    color: darkblue;
  }
</style>

What Is JavaScript?

JavaScript makes your website interactive.

Example:
Add a button to your HTML file that displays a message when clicked:

<button onclick="alert('Hello, world!')">Click Me</button>