Kidz Olympiad🎉

ICT Class 10 - Html Notes

Comprehensive study notes for Class 10 - Html olympiad preparation

HTML (HyperText Markup Language)

Welcome to the chapter on HTML for Class 10. In this chapter, you will learn what HTML is, why it is important, and how to create simple web pages using HTML tags. By the end of this chapter, you will be able to write basic HTML code and understand the structure of a web page!

Introduction to HTML

HTML stands for HyperText Markup Language. It is the standard language used to create web pages. HTML uses special codes called tags to tell the browser how to display text, images, links, and other content.

Basic Structure of an HTML Document

Every HTML document has a basic structure: 


<!DOCTYPE html>
<html>
  <head>
    <title>My First Web Page</title>
  </head>
  <body>
    <h1>Hello, World!</h1>
    <p>This is my first web page.</p>
  </body>
</html>
  • <!DOCTYPE html>: Tells the browser this is an HTML5 document.
  • <html>: The root element of the web page.
  • <head>: Contains information about the page (like the title).
  • <title>: Sets the title of the page (shown in the browser tab).
  • <body>: Contains the content that appears on the page.

Common HTML Tags

  • <h1> to <h6>: Headings (h1 is the largest, h6 is the smallest)
  • <p>: Paragraph
  • <a>: Link to another page
  • <img>: Image
  • <ul>, <ol>, <li>: Lists (unordered, ordered, list item)
  • <br>: Line break
  • <hr>: Horizontal line
  • <table>: Table

Creating a Simple Web Page

Here is an example of a simple HTML page: 


<!DOCTYPE html>
<html>
  <head>
    <title>About Me</title>
  </head>
  <body>
    <h1>My Name is Riya</h1>
    <p>I am learning HTML.</p>
    <img src="myphoto.jpg" alt="My Photo" />
    <a href="https://www.example.com">Visit Example</a>
  </body>
</html>

Practice Questions

  1. What does HTML stand for?
  2. Write the HTML code to display "Welcome to My Website" as a heading.
  3. Which tag is used to add an image?
  4. How do you create a link to another website?
  5. What is the purpose of the <title> tag?

Challenge Yourself

  • Create a simple HTML page about your favorite hobby. Add a heading, a paragraph, and an image.
  • Make a list of your three favorite websites using the <ul> and <li> tags.

Did You Know?

  • HTML was invented by Tim Berners-Lee in 1991.
  • All web pages you see on the internet are made using HTML!

Glossary

  • HTML: HyperText Markup Language, used to create web pages.
  • Tag: A special code in HTML that tells the browser how to display content.
  • Element: A complete set of opening and closing tags with content.
  • Attribute: Extra information inside a tag (like src in <img>).

Answers to Practice Questions

  1. HyperText Markup Language
  2. <h1>Welcome to My Website</h1>
  3. <img>
  4. <a href="URL">Link Text</a>
  5. It sets the title of the web page (shown in the browser tab).

Practice writing HTML code to create your own web pages and explore the world of web development!

Quick Navigation