HTML An Introduction
Introduction
Internet is a network that is used by everyone to access various websites which located on the internet server, and a website is written with the help of HTML (Hyper Text Markup Language) is read by the help of web browsers, converts that document in the language understood by us and display them on the screen.
HTML – Hyper Text Mark-up Language
HTML is a language that use to creat Webpage and website that can be displayed on World Wide Web. It is improved version of Standard Generalised Markup Language (SMGL).
SMGL is a Meta Language used to defining and creating descriptive markup language.
Features of HTML Language
Easy to learn.
It is not case-sensitive language.
It does not require technical knowledge to learn.
HTML Writing Tools
Text Editor
WYSIWYG Editor (What You See Is What You Get)
Structure of an HTML Document
Container Elements
These elements have opening and closing tags that's why it is also know as
"Paired tags". Closing tag of these elements will be written with a '/’.
E.g. <HTML> </HTML>, <TITLE> </TITLE>, <BODY>
</BODY>,.... Etc.
Empty Elements
These elements have no need of closing tags, these elements are also known
as "Standalone tags".
E.g. <HR>, <BR>,...... etc.
Attributes Elements
These elements are used inside the tags for the additional information about
tags.
E.g. <BODY bgcolor="red">
In this tag bgcolor is attribute of the main tag <BODY> and red is the
value of bgcolor.
Basic HTML Tags
Every HTML document contains some standard tags and these tags form the
basic structure of HTML document are known as Basic tags and they are :-
- <HTML> Tag :- This is a container tag to define the document and browser that the document is a HTML document.
- <HEAD> Tag :- This is also a container tag used to display information that you do not want to display directly on the web pages. it contains <title> tag.
- <TITLE> Tag :- Title tag is use to give title of document or web page that appears in the tab of browser. It is also a container tag.
- <BODY> Tag :- The information which you want to publish on your website will written under the <BODY> tag. this tag is also a paired tag.
Tags of an HTML
<BODY> Tag
All elements like text, video, image, links etc which display on the web
page are all written inside the <BODY> tag.
<BR> Tag
This tag is used to sift text to the next line. This tag has no
attributes and its known as empty elements.
Heading Tag
This tag is use to give headlines of your contain, the text appear
bolder than normal fonts. HTML provide six type of heading from H1 to
H6, here H6 stand for smallest heading and H1 stand for largest heading.
E.g.
Heading tag has only one attribute known as text-align, and text-align
attribute have three values :- Left, Center, Right.
E.g. <h1 text-align="left">Heading level 1</h1>
<h2 text-align="right">Heading level 2</h2>
<h3 text-align="center">Heading level 3</h3>
<P> Tag
<P> tag is a container tag, the text which written in side this
tag is appeared as paragraph and a blank line is enclosed before and
after the text, this tag has also only one attribute known as
text-align, and text-align attribute have three values :- Left, Center,
Right.
E. g. <P text-align="center">Welcome to JRWorld HTML theory
part</P>
<HR> Tag
The use of <HR> tag is to inserts a straight horizontal line
across the webpage to divide the page into different sections.
By default it appears shaded and spans the width of the browser.
FONT Tag
Font tag is used to change the size , color and types of font. It is a
container tag.
<B>,<I>and<U>tags
These tags are called as style tags, these tags highlight the test and
make it appear bolder, underlined or italic then the normal fonts.
<B> tag is used for making the text bold.
<U> tag is used for Underlining the text.
<I> tag is used to make the text italic form.
Comment tags
Comment tags are used to insert comments in HTML source code. This tags are
visible to anyone that view in source code, but not visible when the HTML
document is execute with browser. It used to place notifications and
reminders in your HTML document.
<!-- Write your comments here
-->
<Center> Tag
<Center> tag is used to center whatever is between this tags.
E.g. <center> This will be center Aligned </center>
This text will be center aligned will appear as in the middle of the
browser.
<div> Tag
The <div> tag defines a division or a section in an HTML document.
By default, browsers always place a line break before and after the
<div> element.
<div> tag has one attribute align which align the text/any other
element to left, right, center, and justify.
<SUB> - Subscript tags
This tag is used when we want to display some text below the normal line of
text.
e.g. H2O
Written as H<sub>2</sub>O
<SUP> - Superscript Tag
This tag is used when we want to display the text above the normal line of
text.
e.g. 52
Written as 5<sup>2</sup>
HTML lists
The index that is formed using numbers like 1, 2, 3,… or symbols like a, b,
c,… is called a list in HTML. These lists help in formatting the data and
put them in a particular order.
There are three types of lists that you can use in HTML. They are:
- UL – Create an unordered or bulleted list.
- OL – Create an ordered list or number list.
- DL – Create a definition or glossary list.
Unordered list <ul> ….. </ul>
It classifies the data items that have equal importance i.e. none of the
data item are ranked or it does have any order.
They are identified by a symbol may be
Disc <ul type=“disc”>
Square <ul type=“square”>
Circle <ul type=“circle”>
The attribute TYPE helps in using the symbol to create a list.
Ordered list <ol> ….. </ol>
It classifies the data items that do not have equal importance. All the data
item are ranked. The ranking can be done using the number (1, 2, 3,…), the
roman (i, ii, iii,….) or alphabet (a, b, c, ….), and default symbol is
number.
Definition term lists <dl> ….. </dl>
Definition list used to format and display display definition on the
webpage. The list prepared by <dl> tag is similar to a dictionary. The
other tags used with this are <dt> to define the definition term and
the <dd> for the definition of the list item.
Nesting of lists
Placing a list (order or unordered) inside another list is called nesting of
list. In HTML two lists two lists can be placed inside each other for
creating a nested list.
e.g.
Stream Available
1. Science
- PCM
- PCB
- PCBM
2. Commerce
- With maths
- Without maths
3. Humanities
- History
- Sociology
Full Chapter cover in one video
No comments:
Post a Comment