HTML: Hyper Text Markup Language.
Year 10+
HTML is the standard markup language to create Web pages and with HTML you can create
your own website that includes text, pictures, objects, audio and video and many more.
HTML contains many tags and it is easy to learn and you will enjoy it!
Let’s try HTML
Day 1
Computer Practical
Editor: Notepad is the simplest and easy Editor where you can type these tags.
Step1: Start Notepad application on the PC that you are using.
Step2: Type the following tags in Notepad.
The code inside left angle < and right angle > are called the tags, so use and type it correctly,
otherwise your message will not appear in browser.
Each opening tags must be closed at the end with / sign as shown below
<html>
<Title> Type Your name </Title>
<Body>
<h1> This is my first web page.</h1>
<h2> <center> Welcome to Prasiddha Model School <center> </h2>
<br>
<br>
<h3>Welcome to my page first web page </h3>
<h3> Here you will find lot of information about me and about my school.</h3>
<br>
<h2> About me </h2>
<br>
</Body>
</html>
The content inside the <body> section will be displayed in a browser and the content inside the <title>
section will be displayed in the browser's title bar.
Step3: Save the file with html file extension. For example if your name is Binita, the file name
must be [Link]
Step 4: Start Web browser that is installed in your PC and open the file that you have just saved
in Notepad. Enjoy your first Web Page.
Enjoy learning your FIRST WEB PAGE!!!!
HTML tags and Web browsers
Web Browsers
A Web browser or simply a browser is an application software that displays message or
information on World Wide Web (WWW).
The most common web browsers are the Internet Explorer, Chrome, Edge, Firefox, and Safari
etc. is to read HTML documents and display them correctly.
HTML tags
HTML tags are used to define the structure and content on a webpage.
Each tag consists of keyword enclosed in angle brackets e.g. <p> and it comes in pairs, opening
tag <h1> and closing tag </h1>.
HTML elements are the contents that are inside opening and closing tags.
<h1> This is my first web page.</h1>
start tag html element end tag
Let’s try HTML
Day 2
Computer Practical
Step1: Open the html file that you have previously created and continue to expand your
creativity.
Use the following HTML text formatting tags in your first web page to make the web page more
vibrant and attractive.
<b> tag - Bold Text <i> tag - Italic Text
<u> tag - Underlined Text <strong> tag - Strong Text
<em> tag - Emphasized Text <sup> tag - Superscript Text
<sub> tag - Subscript Text
Enjoy learning your FIRST WEB PAGE!!!!
HTML Attributes
HTML attributes are special words that provide additional information about the elements.
Some of the attributes are:
The style The style attribute set the style such as font, size, colour, etc., of the HTML element.
attribute
Examples
Font size <h1 style="font-size: 14"> This is font size 14 </h1>
Font color <h1 style="color: RED"> This sentence will be in red
color </h1>
Font size
<h1 style="font-size: 14"> This is font size 14 </h1>
<p style="background-color: lightblue;">This is a
paragraph with a light blue background.</p>
Font
background
color
Red #FF0000 White #FFFFFF Color names and color codes
Cyan #00FFFF Silver #C0C0C0
Blue #0000FF Gray or Grey #808080
DarkBlue #00008B Black #000000
LightBlue #ADD8E6 Orange #FFA500
Purple #800080 Brown #A52A2A
Yellow #FFFF00 Maroon #800000
Lime #00FF00 Green #008000
Magenta #FF00FF Olive #808000
Pink #FFC0CB Aquamarine #7FFFD4
Enjoy learning your FIRST WEB PAGE!!!!
The src The src attribute of <img> specifies the path to the image to be displayed
attribute
href The href attribute of <a> specifies the URL of the page the link goes to
alt The alt attribute of <img> provides an alternate text for an image
lang The lang attribute of the <html> tag declares the language of the Web page
title The title attribute defines some extra information about an element
width and The width and height attributes of <img> provide size information for images
height
attributes
Let’s try HTML
Computer Practical Day 3
Use the following HTML paragraph formatting tags in your first web page to make
the web page more vibrant and attractive.
Enjoy learning your FIRST WEB PAGE!!!!