HTML Basics - WebCore

HTML Guide

What is HTML?

HTML (HyperText Markup Language) is a markup language used to structure content on the web. It tells the browser what each part of the content represents, such as headings, paragraphs, links, images, and forms.

Why HTML is called a Markup Language?

HTML uses tags to mark up content. These tags describe the meaning and structure of content rather than performing logic like programming languages.

Basic Document Structure

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <title>Page Title</title>
  </head>
  <body>
    Content goes here
  </body>
</html>

Semantic HTML Tags

Semantic tags clearly describe the purpose of the content they contain. They improve readability, SEO, and accessibility.

<header> – Page or section header
<nav> – Navigation links
<main> – Main content of the page
<section> – Group of related content
<article> – Independent content
<footer> – Footer section

Common HTML Elements

<h1> to <h6> – Headings (use one <h1> per page)
<p> – Paragraph
<a href=""> – Hyperlink
<img src="" alt=""> – Image (alt is required)
<ul>, <ol> – Lists
<form> – User input forms

Importance of HTML

HTML is the foundation of every website. Without HTML, CSS and JavaScript cannot work. A strong understanding of HTML is essential for frontend development.

CSS (Cascading Style Sheets)

What is CSS?

CSS is used to style and design web pages. It controls colors, fonts, spacing, layout, and responsiveness.

Why CSS is Important?

Makes websites attractive
Improves user experience
Separates content from design

CSS Syntax

selector {
  property: value;
}

Types of CSS

Inline CSS
Internal CSS
External CSS

Common CSS Selectors

Element selector
Class selector (.class)
ID selector (#id)
Attribute selector
Pseudo-classes (:hover)

CSS Box Model

The box model consists of margin, border, padding, and content.

Layout Techniques

Flexbox
Grid

JavaScript

What is JavaScript?

JavaScript is a programming language used to make websites interactive. It allows dynamic behavior like form validation, animations, and API calls.

Why JavaScript is Important?

Adds interactivity to websites
Handles user actions
Used in frontend and backend

Basic JavaScript Example

<script>
  alert("Hello World");
</script>

What JavaScript Can Do?

Manipulate HTML and CSS
Handle events (click, submit)
Validate forms
Fetch data from servers

JavaScript in Web Development

JavaScript works with HTML and CSS to create modern web applications. Frameworks like React and Vue are built using JavaScript.