HTML Tutorial for Beginners: Structure, Tags, Headings, Paragraphs, Links, Images, and Tables

-

What is HTML?

HTML (HyperText Markup Language) is the standard language used to create and display content on web browsers.
It was developed by the World Wide Web Consortium (W3C).
  • HTML uses markup tags to define the structure and format of content.
  • Each HTML element usually has a start tag and an end tag:

<start-tag>Content</end-tag>

🔹 Basic Structure of an HTML Page

<!DOCTYPE html>
<html>
  <head>
    <title>Home Page</title>
  </head>
  <body>
    <!-- Content goes here -->
  </body>
</html>

Explanation:

<!DOCTYPE html> → Informs the browser that this is an HTML5 document.
<html> → Root element of an HTML page.
<head> → Contains meta-information, title, and links to styles/scripts.
<body> → Contains visible content like text, images, links, tables, etc.

🔹 Example 1: Displaying Text with Formatting

<!DOCTYPE html>
<html>
  <head>
    <title>Home Page</title>
  </head>
  <body>
    <b>HTML is developed by W3C</b> <!-- Bold text -->
    <i>W3C stands for World Wide Web Consortium</i> <!-- Italic text -->
    <b>Inbuilt functions in HTML</b><br> <!-- Line break -->
    <strong>Every HTML tag has a start tag and end tag</strong> <!-- Strong/Bold text -->
  </body>
</html>

🔹 Example 2: Headings in HTML

HTML provides 6 levels of headings: <h1> to <h6>

<!DOCTYPE html>
<html>
  <head>
    <title>Headings Example</title>
  </head>
  <body>
    <h1>Heading 1</h1>
    <h2>Heading 2</h2>
    <h3>Heading 3</h3>
    <h4>Heading 4</h4>
    <h5>Heading 5</h5>
    <h6>Heading 6</h6>
  </body>
</html>

🔹 Example 3: Paragraphs

<!DOCTYPE html>
<html>
  <head>
    <title>Paragraph Example</title>
  </head>
  <body>
    <h1>Java Introduction</h1>
    <p>
      Java was developed by <b>Sun Microsystems</b>, currently acquired by 
      <mark>Oracle</mark>. <!-- Highlighted text -->
    </p>
  </body>
</html>

🔹 Example 4: Hyperlinks

<!DOCTYPE html>
<html>
  <head>
    <title>Link Page</title>
  </head>
  <body>
    <a href="http://www.google.com">Google Home</a> <!-- Link to Google -->
  </body>
</html>

🔹 Example 5: Images

<!DOCTYPE html>
<html>
  <head>
    <title>Image Example</title>
  </head>
  <body>
    <img src="C:\Users\Md Arshad\Desktop\html\img.jpg" 
         alt="No Image Found" 
         width="500px" 
         height="500px">
  </body>
</html>

🔹 Example 6: Tables

<!DOCTYPE html>
<html>
  <head>
    <title>Table Example</title>
    <style>
      table, th, td {
        border: 1px solid black;
        border-collapse: collapse;
        text-align: center;
      }
    </style>
  </head>
  <body>
    <table width="100%">
      <tr>
        <th>Name</th>
        <th>Address</th>
        <th>Phone</th>
        <th>Email</th>
      </tr>
      <tr>
        <td>Ram</td>
        <td>Chennai</td>
        <td>81224209319</td>
        <td>ram@gmail.com</td>
      </tr>
      <tr>
        <td>Shyam</td>
        <td>Mumbai</td>
        <td>987654321</td>
        <td>shyam@gmail.com</td>
      </tr>
    </table>
  </body>
</html>

Comments

Post a Comment

Popular posts from this blog

History of Java Programming Language | Features, Origin & Uses

-
History of Java Programming Language  Java is a world famous programming language. It is a high-level, object-oriented programming language developed by Sun Microsystems in the early 1990s. Java's development began in 1991 with the goal of creating applications for embedded devices, setup boxes, microwaves, digital cable systems, and web applications. The language was officially released to the public in 1995. Who Created Java Programming? The Java design was led by James Gosling, along with a small team of engineers known as the Green Team. Their original thing was to produce a programming language for consumer electronic  bias  similar as interactive  TV systems. still, the focus  latterly shifted to  erecting a platform-independent language suitable for general- purpose programming.  Origin and Naming of Java Firstly, Java was named Oak, inspired by an oak tree located outside James Gosling’s office. The name was  latterly changed to Java becau...
Read more

Inheritance in Java: Types, Examples, and Explanation

-
Inheritance in Java Inheritance is one of the core concepts of Object-Oriented Programming (OOP). It allows one class to inherit the state (variables) and behavior (methods) of another class.  In simple words, inheritance promotes code reuse and establishes a parent–child relationship between classes. ✅ Definition Inheritance is a mechanism where one class acquires the properties and methods of another class The class that provides data is called the Superclass (Parent class) The class that receives data is called the Subclass (Child class) In Java, inheritance is implemented using the extends keyword 🌍 Real-Life Example Family Inheritance A child inherits eye color, height, and surname from parents Parents → Superclass Child → Subclass Similarly, a subclass inherits variables and methods from its superclass. 🔹 Syntax of Inheritance class SubClass extends SuperClass {     // subclass members } 🔑 Important Points A subclass consumes the state and behavior of the supercl...
Read more

Java Programming Features Every Beginner Should Know

-
Features of Java Java is a powerful programming language that provides several important features, making it popular for developing secure and reliable applications. 1. Platform Independent Java is called a platform-independent language because a Java program does not depend on a specific operating system. When a Java program is compiled, it generates a .class file. This file contains intermediate bytecode, not machine-specific code. The .class file can run on any operating system as long as the system has JVM (Java Virtual Machine) installed. This concept is known as “Write Once, Run Anywhere.” 2. Java Compiler The Java compiler (javac) is a program that converts the source code written by a developer into bytecode. The compiler: Takes a .java file as input Converts it into intermediate machine code Stores the output in a .class file This bytecode is platform independent and can be executed on any system with JVM support. 3. Java Virtual Machine (JVM) The JVM (Java Virtual Machine) ...
Read more