Best HTML Text Editor
We can create HTML document with text Editor like :-
Best Book recommendations for beginners
The book teaches readers the basics of building web sites in HTML5 and
CSS3. It begins by talking about different versions of HTML and CSS and
describes how modern web pages should use structure and semantics to
describe their contents. There are chapters that deal with core topics
including: marking up text, images, lists, tables, forms, audio and video.
Each of these chapters would introduce relevant HTML5 elements.
Structure of an HTML Document
Container Elements :- These elements have opening and closing tags that's
why it is also know as "Paired tags".
E.g. <HTML>, <TITLE>, <BODY>,...... etc
closing tag of these elements will be written with a '/' like </HTML>,
</TITLE>, </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
- <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.
Let's discuss Tags of HTML in more detail
<BODY> Tag
All elements like text, video, image, links etc which display on the web page
are all written inside the <BODY> tag.
The attributes of the <BODY> tag
| Attributes | Purpose | Example |
| bgcolor |
Used to fill background color. Default color of the background is white |
<BODY bgcolor= "red"> |
| text | Used to give the different values of text | <BODY text="blue"> |
| background | Use to set an image as background of web page | <BODY background = "C:\documents\ flower.jpeg" |
| leftmargin | Use to give the amount of space that can be blank from the left margin of the browser window. its value is specified in pixels. | <BODY leftmargin= "20"> |
| topmargin | Use to give the amount of space that can be blank from the top margin of the browser window. its value is specified in pixels. |
<BODY topmargin= "30"> |
<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.
<h1>Heading level 1</h1>
<h2>Heading level 2</h2>
<h3>Heading level 3</h3>
<h4>Heading level 4</h4>
<h5>Heading level 5</h5>
<h6>Heading level 6</h6>
Heading tag has only one attribute known as Align, and Align attribute have
three values :- Left, Center, Right.
E.g. <h1 align="left">Heading level 1</h1>
<h2 align="right">Heading level 2</h2>
<h3 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 Align, and Align
attribute have three values :- Left, Center, Right.
E. g. <P 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
The attributes of <HR> tag
| Attribute | Purpose | Example |
| size |
used to change the thickness of horizontal line. The value should be in pixels |
<HR size= "20"> |
| width |
Use to dine the length of horizontal line. The value should be in percentage or pixels |
<HR width= "10%"> |
| align | Use to align horizontal line in left, right or center | <HR align= "center"> |
| noshade | Use to display the horizontal line as a solid shape in grey colour. | <HR noshade> |
| color | Use to define the color of horizontal line. | <HR color= "red"> |
<FONT> Tag
<FONT> tag is a container tag used to change the size, color and type of
font of text.
The attributes of <FONT> tag
| Attributes | Purpose | Example |
| face | Use to change the types of the font | <FONT face= "Arial"> |
| color | Use to change the color of the font. | <FONT color= "red"> |
| size |
Use to change the size the font size. |
<FONT size= "6"> |
Style Tags
<B>, <I>, and <U> are style tags.
function of style tags
<B> tag is used for making the text Bold
<U> tag is used for underlining the text
<I> tag is used for making text italic
<TT> tag is used set the text to typewriter text.
Physical tags
Physical tags are used to indicate specific character to be formatted.
Syntax <Tag Name> Character to be formatted </Tag Name>
E.g. of Physical Character Tags:
| Starting Tag | Description | End Tag |
| <B> | Bold text | </B> |
| <I> | Italic text | </I> |
| <TT> | Typewriter text format | </TT> |
| <BIG> | Display text in a big font | </BIG> |
| <SMALL> | Display text in a small font | </SMALL> |
| <SUB> | Display as a subscript, in a smaller font | </SUB> |
| <SUP> | Display as a subscript, in a smaller font | </SUP> |
| <U> | Underline the text | </U> |
Logical tags
Logical tags are used to describe to the browser enclosed text's meaning
Syntax <Tag Name> Character to be formed </Tag Name>
E.g. of Logical Character Tags:
|
Starting Tag |
Description | End Tag |
| <EM> | Usually displayed in Italics | </EM> |
| <STRONG> | ||
<Comment> Tag
This tag is use to insert comments in HTML source code, which is not
executable and not display on page. These comments are visible to anyone who
views the page source code. This is used to palce a reminder in HTML code.
Syntax <!-- Write your comments here-->
<div> Tag
This tag is use as container or section in a HTML document may consist of h1,
h2, paragraph, etc.
It has one attribute align which align the text and other element to right,
left, center, justify.
<SUB> - Subscript Tag
The text which written between open and close tag will appear in below the
normal text of the line.
E.g. H2O will written as H2O
<SUP> - Superscript Tag
The text which written between open and close tag will appear in above the
normal text of the line.
E.g. X2 will written as X2
Listing in HTML
There are three types of list in HTML
⮚UL - Create an unordered list or bulleted list
⮚OL - Create an ordered list or number list
⮚DL - Create same an unordered list.
Unordered List attributes
There are one attribute of Unordered list and there 3 value
1. Disc
2. Square
3. Circle
E.g. <ul type ="square">
<ul type ="circle">
<ul type ="disc">
Ordered List attributes
There are 2 attributes of ordered list
| Attributes of ordered list | Purpose |
| TYPE | Select symbols it take value itself i.e. "a" or "A" or "1" or "i" or "I" |
| START | Select the specific value from where you want to begins the list |
Nesting of List
Place a list inside ordered or unordered another list is called the nesting of list.
E.g.
1. Science
- PCM
- PCB
2. Commerce
Definition Term Lists
Don't Forget to access Our HTML/CSS practical_tutorial for beginner
No comments:
Post a Comment