HTML

vmsmprogramming




 




   HTML:-  It stands for Hyper Text Markup Language. Where hypertext means linked text and markup means styling and language means language.
¯  It is a markup language not a programming language.
¯  It is used to mark the contents that helps in designing web pages.
¯  The web pages of website are published and linked together with the help of markup language.
¯  Hypertext is the way of creating documents that can be displayed on the web or internet and which helps to establish links between themselves and cross links to other web pages.
¯  Markup is the way of marking the text by applying formatting features in web documents and producing different types of effect when the document is displayed.
¯  HTML contains tags that tells the browser, how the contents of web page has to be displayed.
¯  It is a very simple  language.

 HISTORY OF HTML:-

¯  The  ‘hypertext’ was coined by Ted Nelson around 1960 for linking the documents over the internet so that user can navigate  easily from one document to other.
¯  During 1980, IBM developed General Markup Language(GML) .
¯  After some time ANSI(American National Standard Institute) published a SGML(Standard general markup language). SGML which was higher level markup language was adopted by  US internal Revenue Service and Department of Defence , USA.
¯  After  simplifying further , HTML was developed  by Tim Berners Lee in 1990. He is a scientist at CERN(Conseil European pour la Recherche Nucleaire)   Laboratory  in Geneva , Switzerland.
¯  HTML was designed to create web pages that can be viewed on any type of computer architecture or by using any web browser on internet.


   EVOLUTION OF HTML:-
                                                                       HTML was developed in the following stages such as-

¯  Level 0:- this was the first stage . At this stage HTML used structural elements that were supported by all web browsers.
¯  Level 1:- this was the second stage of development and it included enhanced features such as text highlighting and graphics , this stage of HTML was supported by standard web browsers.
¯  Level 2:- this was the third stage of development. At this stage certain interactive features were used such as list boxes , buttons etc.
¯  Level 3 :- this was the fourth stage of development and it included attractive features like sound , video , frames etc. This stage also supported mathematical equations and formulae.
¯  Level 4:- this is the present level of HTML which includes many advanced features and is an enhancement over level 3.

 FEATURES OF HTML:- 
There are following features of HTML such as-
¯  HTML is neither a word processing tool, nor a programming language, rather it is a markup language.
¯  HTML is the character-based method for describing and expressing the contents. The contents may be a picture , text , sound and video clips.
¯  HTML is a platform independent language i.e HTML document can run on any type of operating system.
¯  HTML is not a case sensitive language.
¯  HTML allows to format text , graphics , sound and video and save in an ASCII(American Standard Code of Information Interchange) code.
¯  HTML documents can contain hyperlinks,  this means a user can navigate from one page to another as needed and can access and retrieve information from other sites.
¯  To type HTML code we  require text editor and to run the HTML code we require web browser.  



TEXT EDITOR:-  

¯  It is a type of application software.
¯  It provides layout in which the text can be typed along with proper HTML syntax to create web pages.
¯  It  can be character or graphical based.
¯  Word pad, Notepad , Word Perfect , Bracket , Netscape Composer , Kwrite , Front Page.. etc. are the example of text editor.
¯  The HTML  code is saved with extension name .HTML or .HTM.


Web Browser:-
¯  It is an application software that helps to navigate through different websites on internet and display web pages.
¯  It enables to display text , images , video, music  or other contents which are coded in HTML code within text editor.
¯  It allows a user to easily and quickly access the information that are uploaded over the internet by traversing through hyperlink.
¯  The user requests a page from web server with the help of web browser. After receiving the request through the web browser, the web server makes it available for web browser to display the page.

¯  Google chrome  , opera mini, Mozilla Firefox , Apple Safari  , internet Explorer , edge ...etc. are the example of web browser. 


TAGS:- It refers to the code of instructions that are written within angular bracket (like < >).
¯  It is the fundamental unit of coded document in HTML which is used to perform an action.
¯  A tag tells the web browser , how that part of the document is to be displayed in web page.
¯  If the tags are not written  within angular bracket then web browsers interpret the code as a normal text.
¯  We should not give extra space between the brackets. Because browsers do not recognize the tag and it will not display the information correctly.


 There are two types of tags such as:-
1.       Container tags
2.       Empty tags.

Container tags:- 
    
  ¯  The  tags which are written in pair are called ‘container  tag’.
  ¯  It has an opening and a closing tag.
  ¯  The closing tag is same as opening tag but it is written with forward slash(/) before the tag name.
  ¯  It defines the section of text and specify about the formatting of all the contents inside it.
  ¯  This tags are also known as paired tags or ON/OFF tag.




Empty Tag:-

  ¯  It is the stand alone tags which are used in single i.e  not in pairs.
  ¯  It has no any ending or closing tag like container tag.
  ¯  This tag is used for formatting the contents such as line break , inserting image, etc.
  ¯  It has only opening tag. So this is called as ON tag.
  ¯  The empty tags do not act on block of text.
  ¯  These tags are also termed as singular tags.


Example :-     <HR>      ( It is used as single tag and it insert a horizontal rule).




HTML SECTION:-   it defines the header part of the HTML document in which <HTML> tag is used.
|  The entire coding is written within <HTML>....................</HTML> tag.
|  It marks the beginning and ending of a HTML coded document.

Syntax:-    <HTML>...................</HTML>


HEAD SECTION :-    it specifies  the head information about the document.
  |  This section is opened with the <HEAD> tag and closes with </HEAD> tag.
  |  It contains the <title> tag.
  |  It is always written within <html> tag.

Syntax:-   <HTML>
                       <HEAD>
                       <TITLE>
                 ....................
                ......................
        </TITLE>
        </HEAD>    


TITLE SECTION :-  It displays the title of the web page on the Title bar.
|  It is defined within the <HEAD> tag.
|  Its output does not appear in the body of the web page.
|  Title tag is not mandatory to use in an  HTML document.
|  If it is not included in an HTML document , the word ‘Untitled’ will appear in the browser title bar.

Syntax:-    <HTML>
                   <HEAD>
                <TITLE>
..............................
..............................
</TITLE>
</HEAD>
</HTML>


BODY SECTION:- It defines the main contents of a  HTML document  i.e  the contents of the document used to be displayed in the web pages are composed within <BODY> tag.
     |  Images , text matter and links to other web pages are also added within the body section.
     |  The <BODY >tag starts immediately after closing the <HEAD> tag.


SYNTAX:- <HTML>
                 <HEAD>
                <TITLE>
...............................
</TITLE>
</HEAD>
<BODY>
...............
................
</BODY>
</HTML>

FOOTER SECTION:- The last part of the body of an HTML document is footer.
|  It does not have any special tag.
|  It does not have any significance on the looks of the document.
|  It is mainly used to identify some ending matter like URL of the page, date of the data prepared , the version , author’s name , address , e-mail id , phone no., ....etc by using comment tag.

|  It is not mandatory to apply Footer in the HTML document.






           HOW TO CREATE HTML DOCUMENT
                                There are following steps to create HTML document such as :-
     Ø  First of all open the text editor software like notepad , bracket ..etc
     Ø  Type the HTML code  and save with ” .htm” or ” .html” file extension name.
     Ø  To see the output you have run the saved html file.



 I am going to see here by pictures-

              first of all open the text editor-



2.       Type html code  in text editor-


    save the file -













To see the output you have to run the saved HTML file -



Here output 

3
                    

                     

ATTRIBUTES:-  it is the features of own each tag which are used to change the appearance of different parts of the web page.


   |  It is always written immediately after an opening tag which is separated by blank space.

   |  The ending tag does not contain any attributes or value.

   |  The value of the attribute is assigned with assignment operator( =) within double quotes.

   |  It is used to define data source or destination.

   |  It is used to specify the characteristics of the text to which a tag is applied.

Syntax :-    <tag name attribute name1 = “value” attribute name2=”value”>

Attributes used in <BODY> tag :-


There are eight attributes of body tag:-

   Ø  BGCOLOR

   Ø  BACKGROUND

   Ø  TEXT

   Ø  LINK

   Ø  ALINK

   Ø  VLINK

   Ø  LEFTMARGIN

   Ø  TOPMARGIN

BGCOLOR Attribute:-  This attribute is used to set the background color of the displayed screen.

|  By default, the background of the web browser is white.

|  Different colors can be obtained  on the display screen by the combination of three basic colors namely, red, green, blue.

|  Each color can be defined by the helps with color code in hexadecimal form.

|  The color code is always start with   hash (#) symbol.

Syntax:-  <BODY BGCOLOR=”COLOR NAME” OR  BGCOLOR=”#RRGGBB”>    </BODY>




HOW TO MAKE COLOR CODE:-

Ø  If you write color code for displaying a RED color then you have to type such as- #FF0000.

Ø  If you write color code for displaying GREEN color then you have to type such as- #00FF00.

Ø  If you write color code for displaying BLUE color then you have to type such as- #0000FF.

Ø   If you make a new colour  by mixing RED and BLUE colour then you have to type such as- #FF00FF.

Ø  If you make a new colour by mixing RED and GREEN colour then you have to type such as- #FFFF00.

Ø  If you make a new colour by mixing GREEN and BLUE colour then you have to type such as-#00FFFF.




























EXAMPLE:-  <BODY  BGCOLOR=”ORANGE”>   </BODY>

COADING:-




OUTPUT HERE-




TEXT ATTRIBUTE:- This attribute is used to set the colour of text in web page.

     ¯  Colour value is set in the same manner as set in BGCOLOR.

     ¯  By default , the text colour is in black or white or grey.

Syntax :- <BODY   text=”COLOR NAME “ or “COLOR CODE”>


COADING :-


 OUTPUT HERE-





BACKGROUND ATTRIBUTE :-  this attribute is used to set a picture as the background of a web page.

¯  Background image can be textual or image.

¯  It is used when we want to set logo in the background of the web page.

Syntax : - <BODY BACKGROUND =”URL OF file “ >
Note :- you  will not able to use both BGCOLOR and BACKGROUND attribute.


COADING :-




OUTPUT HERE-




LINK ATTRIBUTE :-  this attribute is used to set the colour of the link in web page.

     ¯  By default the colour of the   LINK is blue.

                                        Syntax :- <body link=”green” >


COADING:-




OUTPUT HERE-



ALINK ATTRIBUTE :- it stands for Active Link which is used to set the colour of active   link.

     ¯  By default the colour of the  ALINK is Red.

                                        Syntax :- <body  Alink=”black” >

COADING:-




OUTPUT HERE-





VLINK ATTRIBUTE : - it stands for visited link which is  used to set the colour of the visited link.
    ¯  By default the colour of the  VLINK is purple .

                                        Syntax :- <body  Vlink=” ORANGE” >


COADING:-








OUTPUT HERE-




<FONT >  tag:-  It is a container tag.

     ¯  It is used to set the text color, text size, and typeface of the text.

     ¯  There are three attributes in it such as –

                   1. COLOR        2. SIZE            3. FACE

COLOR ATTRIBUTE:-  This attribute is used to set the color of the text.

Syntax -  <Font COLOR=” colour name”>   VMSM    </Font>

SIZE ATTRIBUTE:-  This attribute is used to set the size of text .

     ¯  It can  be set using Absolute or Relative size values.

     ¯  There are seven absolute sizes of text from 1 to 7.

     ¯  The default size of font of text is three , which is same as the size of regular paragraph text.

    ¯  The relative font size set by either a plus or minus sign preceding the value of size attribute.

Syntax :- <FONT SIZE=+1>
                 <FONT SIZE=-1>

Syntax -  <Font  size=” value in px”>   VMSM    </Font>




FACE Attribute :- this attribute is used to change the typeface of a block of text.

¯  The text typed within the blocks of <FONT> tag can be set with the available face attribute.

¯  User can specify a list of font names, separated by commas and enclosed within quotes. If the first choice is available in the system, the browser uses it , otherwise, it tries the second choice, then the third, and so on.

¯  If the given attribute of the font is not found in computer then the browser accepts the default font of the system.

Syntax :- <Font face=”name of font “>  VMSM   </font>

NOTE:- Each virtual size is successively 20% larger or smaller than the preceding or next value of font size.

The default font size 3. Thus font size 4 is 20% larger than font size 3, font size 5 is 40% larger than font size 3 and so on. similarly, font size 2 is 20% smaller font size 3 and font size 1 is 40% smaller than the font size 3.


<SMALL> Tag-  This is a container tag.
¯  It is used to decrees the one size smaller than the default size. i.e if the default size is 3, it displays the text in size ‘2’.

¯  It can be nested to display to display the blocked text in a smaller form.

Syntax - <SMALL> VMSM </SMALL>

<BIG > Tag-  this is a container tag.
¯  It increase the one size bigger than the default size. i.e if the default size is ‘3’ then it displays the blocked text in size ‘4’.

¯  It can be nested to display the blocked text in a bigger form.

Syntax- <BIG> VMSM </BIG>

<BASEFONT> Tag- This is an empty tag.

¯  It is used to set the default color, size and face types of web pages.

¯  This tag be placed anywhere in the <BODY> tag of a document.

¯  This tag has no effect on heading tags(<H1>  to <H6>).

¯  This tag support only internet Explorer 9 and earlier versions.

¯  It has three attributes such as COLOUR , SIZE, FACE.

COLOR  Attribute:- this attribute of <BASEFONT> tag is used to assign a color which becomes the default color. And has an effect on the entire text from its beginning to end of HTML document.
Syntax :- <BASEFONT COLOR=” COLOR NAME “ OR “COLOUR CODE”>


Size   Attribute:-  This attribute of <BASEFONT > tag .
 it is used to set any possible font size from 1 to 7. Which becomes the default size for the entire HTML document, through default font size for normal body text is 3.

Syntax- <BASEFONT  SIZE= “value”>

Example-<BASEFONT size=”6px”>

FACE  Attribute:- This attribute of <BASEFONT> tag. this is used to assign a new font face for the text of the entire HTML document.

Ø  It sets the font by default for the entire HTML page.

Ø  The default font face is “TIMES NEW ROMAN”.

Ø  Syntax:- <BASEFONT FACE=”font name”>

Ø  Example :- <BASEFONT FACE=”IMPACT”>
NOTE :- The <BASEFONT> tag is not supported by today’s web browser. So this is not in use.

<CENTER > Tag:-  This is a container tag.

Ø  It is used to align the text, picture, table,..etc in the center of the web page.

Ø  Syntax:- <CENTER> text </CENTER>
Ø  Example :- <CENTER> WELCOME IN MY VMSM CLASSES </CENTER>


<HR> Tag:- This is empty tag.

Ø  It is used to add shaded horizontal lines across a web page.

Ø  It is used to separate two different items in a document.

Ø  HR stands for the horizontal rule.

Ø  There are following attribute of <HR> tag such as:-

 SIZE

 NOSHADE

ALIGN

 WIDTH

 COLOR


SIZE   Attribute:-  This attribute of <HR> tag is used to set the thickness of the line in pixels.

Ø  The default size value is 2.

Ø  Syntax:- <HR SIZE=” VALUE”>

Ø  Example:- <HR SIZE=”10PX”>

NOSHADE  Attribute:- This attribute is used to remove shade from the line.

Ø  It produces a grey line without any shade.

Ø  If noshade attribute  is not specified in the <HR> tag  then ruler has a filled in or 3D shade effect.

Ø  To have a flat 2D ruler line just add noshade within <HR> tag.

Ø  Syntax:- <HR NOSHADE>

Ø  Example :- <HR NOSHADE>

WIDTH Attribute :- This attribute is used to change or set the width of horizontal rule.

Ø  The width can be set in pixels or in percentage.

Ø  Syntax :- <HR WIDTH=”value in % or in px”>

Ø  Example :- <HR WIDTH = “20%” >

ALIGN Attribute :- This attribute is used to position the horizontal rule at the left , right or in center  on the browser’s window.

Ø  Syntax:- <HR ALIGN=”LEFT/RIGHT/CENTER”>

COLOR Attribute :- This attribute is used to set the colour of the horizontal line.

Ø  Syntax :- <HR COLOR=”name of colour”>


COMMENTS :- These are text messages which is used to explain about programming code.

Ø  It is used to add remarks to the programs created in any language.

Ø  The comments are not executed by the compilers or web browsers of the programs but are displayed in the source programs as they are.

Ø  They provide additional information about the program.

Ø  It is viewed only in source code file.

Ø  The main reason to include the comments in any program to helps the new user or reader to understand the use of codes in document.

Ø  The exclamatory sign (!) followed by (-) within angular braces (<  >) is used to denote comments used in HTML document. This is not executed by the web browser. It can be viewed only in source program.

Ø  This is not mandatory to specify comments in an HTML document.

Ø  Syntax- <!- something text here ->

Ø  Example- <!- this is created by VIKAS MISHRA->



HEADING TAGS:-  Heading tags are container tags.

Ø  The heading tags are used to add heading in the HTML document.

Ø  Headings are displayed in large and bold fonts than the normal text size.

Ø  This is also used to organize the contents of the text.

Ø  There are six levels of heading tags, the first level <H1> tag displays the largest size of text and the sixth level i.e <H6> tag display the smallest size of the text than other heading tag.

Ø  It has only one attribute which is known as ALIGN attribute.

Ø  Syntax :- <H1  align=”left / right/ center / top / bottom “> name of heading  </H1>
                 <H2> name of heading  </H2>
                 <H3> name of heading  </H3>
                 <H4> name of heading  </H4>
                 <H5> name of heading  </H5>
                 <H6> name of heading  </H6>

Ø  Example :- <H1 align=”left”> name of heading  </H1>
                  <H2  align=”center”> name of heading  </H2>
                  <H3> name of heading  </H3>
                  <H4> name of heading  </H4>
                  <H5> name of heading  </H5>
                  <H6> name of heading  </H6>

  
CODING:- 



OUTPUT:-



TEXT HIGHLIGHTING TAGS:-   Those tags are used to formatting the text is known as text formatting tags.
It is also called font style tag.
It is used to change the appearance of text with their predefined effect.
There are some text highlighting tags such as:-
1.      <B> tag     
                                     
2.      <I> tag  
                                          
3.      <U> tag 
                                         
4.      <S> tag

5.      <SUP> tag

6.      <SUB> tag

7.  <strong> tag

8. <EM> tag

9. < strike> tag

<B> tag :-

     it is  known as bold tag.

    It is sued to bold the text.

    It is  also known as <strong> tag.

    It is a container tag.

    Both <strong> and <B> tag are used for same purpose.

Syntax :- <b> text here </b>
       or
 <strong> text here </strong>

Example:- <B> VMSM classes </B>

<I> tag :-

It is a container tag.

It is known as an italic tag.

It is used to italic the text.

It is also known as <EM> tag.

Syntax :- <I> text here </I>
Or
              <EM> text here </EM>
Example:- <I> VMSM classes </I>

                 OR 

<EM> VMSM  classes </EM>.

<U> tag:-

It is a container tag.

It is known as an underline tag.

It is used to underline the text.

Syntax :- <U> text here </U>

Example:- <U> VMSM CLASSES </U>

<S> tag :-

It is a strike tag.

It is a container tag.

It is used to strike the text.

It is also known as <strike> tag.

Syntax :- <S> text here </S>
                    Or
                              <strike> text here </strike>

Example:- <S> VMSM classes </S>



<SUP> tag :-
It is a superscript tag.

It is a container tag.

It is used to write the mathematical equations.

Syntax :- <SUP> text here </SUP>

Example:- X<SUP> 2 </SUP> + Y<SUP> 2 </SUP>+ 2XY.


<SUB> tag:-

It is a subscript tag.

It is a container tag.

It is used to write the chemical formula.

Syntax :- <SUB> text here </SUB>

Example:- H<SUB> 2 </SUB>O





OUTPUT :-





<BLOCKQUOTE> TAG :-  
It is a container tag.

                              It contains block-level tags.

  It  is used to display the text after leaving a space of two indents from its side margin.

 The display of the initial line of the text under this tag is similar to the text displayed in the paragraph tag. But with a <BLOCKQUOTE> tag , even in the next line of the same paragraph the text appears after leaving the same space as it was in the initial line.

Syntax :- <BLOCKQUOTE> something text here </BLOCKQUOTE>

  Example :-   <BLOCKQUOTE> WELCOME IN MY VMSM CLASSES </BLOCKQUOTE>

<PRE> TAG :- it is a container tag.

 It is used to display the blocked text exactly as it is , with fixed font , space , tab space returns etc.

 The main purpose of this tag is to display the text in a tabular or column format exactly as it is typed in the editor.

Syntax :- <pre> text here </pre>

  Example :- <pre> welcome in my VMSM classes </pre>


<IMG> tag :- it is an empty tag.

The SRC attribute is used within <IMG> tag to specify the location and name of the image file.

The <p> tag should be placed before the <IMG> tag because the <IMG> tag does not form a new block element and would appear in the same line unless we add <p> tag.

Syntax :- <IMG  SRC=” image file location” >

There are following attribute of <img> tag such as:-
1.       SRC
2.       ALIGN
3.       BORDER
4.       WIDTH
5.       HEIGHT
6.       HSPACE
7.       VSPACE
8.       ALT


SRC attribute :-  This attribute is used to specify the location of image file .

Syntax :- <img src=”url of image file “ >

ALIGN  attribute :- This attribute is used to align the text and images according to the specified position on the displayed  web page.

 We can align image in such a way like Top, bottom , left , right , middle.

Syntax :- <img align=”top/middle/ bottom / left/ right”>

BORDER  attribute :-      This attribute is used to specify the width of border around the image. By default border is not set in the image.

Syntax :- <img border=”value”>

WIDTH  attribute:- This attribute is used to specify the width of the image in pixels or  percentage.
Syntax :- <img width =”value”>

HEIGHT attribute :- This attribute is used to specify the height of the image in pixels or percentage.
Syntax :- <img height=”value”>

HSPACE attribute :- This attribute is used to set the space towards left and right of the image. It indicates the given space between the image and the text in numbers.
Syntax :- <img hspace =”value”>

VSPACE attribute :- This attribute of  is used to set the space towards the top or bottom of the image. It indicates the given space between the image and the text in numbers.
Syntax :- <img vspace=”value”>

ALT attribute :- This attribute is used to assign an alternative text that will displayed over the image when the mouse pointer is placed over it. But some browser does not display the image in such away.

Users can see the text which is enclosed within the ALT attribute. The text is displayed whenever the mouse cursor moves over that area.

Syntax :- <img alt=”text”>


Paragraph tag :-  it is a container tag.

It is used to begin a paragraph on a web page.

when the browser encounters this tag , the text moves into a new line skipping one line from the previous line.

It has an optional end tag </p> which may be omitted.


This tag is required when paragraphs of textual matter are needed to be separated.

It has only one attribute which is known as the Align attribute.

Align attribute is used to align or set position of paragraph in web page.

Syntax :- <p> paragraph content </p>


<BR> tag :- This is an empty tag.

It is used to insert a line break.

This tag is useful when sentences are to be written in separate lines.

Syntax :- <BR> text here <BR>

LIST Tag:-  It is used to display the text or any content  serially  in a web page.

The list may be either ordered or unordered . An ordered list is a series of items displayed in specific order . but unordered list display special bullets in the beginning of each list items only.

There are two types of list tag such as:-

1.       <OL> Tag  

2.       <UL> Tag


<OL> Tag :- It is a container tag.

It is used to display a list of items in sequence.

It begins with <OL> tag and it requires <LI> tag to be used along with it.

The items which are followed by <LI> tag appear in sequence on the browser window.

You can also use intermediate heading using <LH> (list heading> tag instead of using the <LI> tag for the list item.

There are following attribute of <OL> tag such as :-

1.       Type

2.       Start

1.       Type attribute :- This attribute is used to define the type of serial or sequence number to be displayed in an ordered list. For example :- 1,2,3....A, B, C,................I, II, III....etc.


Note :- The default value of type start attribute is Arabic Number within ordered list.
The default value of type attribute is disc in unordered list.

2.       Start attribute :- This attribute is used to specify the beginning of value of a series of items from a particular position.
Ø  Syntax :- <OL type =”value” start=”value”>
<LI> item name </LI>
<LI> item name </LI>
<LI> item name </LI>
<LI> item name </LI>
</OL>
<UL> Tag:- This is a unordered list tag.
It is a container tag.
It is used to insert bullets with list of items.
The <LI> tag is used inside the <UL> tag.
It creates unordered list.
Only one attribute is used inside the <UL> tag which is known as “type” attribute.




Syntax:-  <UL Type=”value”>
<LI> TEXT </LI>
<LI> TEXT2 </LI
........................
........................
</UL>

EXAMPLE:- <UL Type=”disc”>
<LI> HTML</LI>
<LI> JAVA</LI>
<LI> DBMS </LI>
</UL>
Nested List :- A list within another list is called nested list.
Nested list can be created with different types of ordered list or unordered list.
The web browser automatically indents the nested list levels and display as “List Items”.
Syntax :-  
<ol type=”value” start=”value”>
<li> text1 </li>
<li> text2 </li>
<li>
<ul type =”value”>
<li> text3 </li>
<li> text4 </li>
</ul>
</li>
</ol>

EXAMPLE :-

<OL type=”A”>
<li> html</li>
<li> DBMS </li>
<li> java </li>
<li> python </li>
<li>
<ul type=”square”>
<li> class 1oth </li>
<li> class 12th </li>
<li> BCA </li>
<li> MCA </li>
</ul>
</li>
</ol>



Linking :-  it is the most powerful features of HTML is to link the text or image or a part of the same document to another document.

Ø HTML support two kinds of linking such as –

1.     External linking

2.     Internal linking

 

v External Linking :- The external linking links two different documents which are present in the main storage of server or computer.

Ø When any user click on the linked text or button then linked document will be opened.

Ø <A> tag which is known as anchor tag . it is used to create a link in  a document.

     Syntax :- <A  href =”link page url”> text </A>

 Example :- <A href=”www.vmsmprogramming.blogspot.com”> PROGRAMMING </A>

 

Note :- TITLE attribute is  used to specify a title for the document to be linked.

Ø any textual matter which is enclosed within double quotes is set of the value of the TITLE attribute.

Ø Many web browsers display the title when the user , place the cursor over the linked object.

Ø TITLE attribute is useful for including some additional information about the source.

Ø Syntax :- < A HREF=”Link page url” TITLE=”text”> text </A>

Example :- <A href=”www.vmsmprogramming.blogspot.com” title=”html”> PROGRAMMING </A>

 

v Internal linking :- the internal linking links the various section of the same document.

Ø By clicking on the linked button , the linked part of the document is displayed on the screen.

Ø <A> tag is also used to make an internal link i.e it can be used to link the other sections of the same document.

Ø To insert internal linking create the link to the segment/section that is to be displayed.

Ø To define segment/section in the document , NAME or ID attribute can be used in the document.

Syntax :-     < A NAME=”segment1”> segment1 </A>

         <A HREF =”#segment1”> text </A>

Example :-   < A name=”segment1”> segment1 </A>

                        < A name=”#segment1”> segment1 </A>

 

TABLE :- it is a collection of rows and columns. It is used to display the data in a tabular format for better understanding. Html is also provides the facility to display tables on a web page.

<table> tag :- this tag is used to create table in a web page. It is used within the body of the HTML document.

Ø <tr> and <tg> tags are used within <table> tag.

Ø <tr> tag is used to create grid of rows within table.

Ø <td> tag is used to enter data in the grid.

Ø Syntax :- <Table>

<tr>

<td> text </td>

<td> text2 </td>

</tr>

</Table>

There are following attributes are used with <TABLE> tag :-

§  BORDER

§  CELLPADDING

§  CELLSPACING

§  HEIGHT

§  WIDTH

§  BGCOLOR

 


Border attribute :- This attribute is used to insert border in the table for its rows and columns.

Ø The thickness of the border is specified by the value of number.

Ø By default the thickness of border is 1.

Cellpadding attribute :- this attribute is used to specify the space between grid line and content in the cell.

Ø The spacing can be increased or decreased by specifying the value in number with this attribute.

Cellspacing  attribute:- this attribute is used to specify the space between cells.

Ø The spacing can be increased or decreased by specifying the value in number with this attribute.

Width :- this attribute is used to increased or decreased the width of the table.

  Height :- this attribute is used to increased or decreased the height of the table.

BGCOLOR :- this attribute is used to assign background colour to the entire table.

Ø The possible of this attribute is same as the value of BGCOLOR of BODY attribute.

Syntax :- <table bgcolor=”color name” border=”value” cellpadding=”value” cellspacing=”value”>

<tr>

<td> text1 </td>

<td> text2  </td>

<td> text3 </td>

</tr>

<tr>

<td> text4 </td>

<td> text5 </td>

<td> text6 </td>

</tr>

<tr>

<td> text7 </td>

<td> text8 </td>

<td> text9 </td>

</tr>

</table>

 

| <th> tag:- it stands for table heading.

Ø It is used to insert heading.     

Ø It is used within <tr> tag.

Syntax :- <table>

            <tr>

            <th> text </th>

            <th>text1</th>

            <th> text2 </th>

</tr>

...................................

....................................

....................................

</table>

 

Spanning of columns and rows :- The columns and rows of table can be spanned(merge) by using colspan and rowspan attribute.

Ø Colspan attribute is used to merge the specified number of columns in one cell where rowspan attribute merges specified number of rows in one cell.

Ø Syntax :- <table>

<tr> <th colspan=”value” > text </th> </tr>

<tr> <th rowspan=”value”> text </th> </tr>

</table>



Comments

  1. Really too good sir....
    Everything is written well....

    ReplyDelete
  2. This comment has been removed by the author.

    ReplyDelete
  3. This comment has been removed by the author.

    ReplyDelete
  4. Vikash sir Namaskar!
    Footer v hota hai kya? isme kuch?

    ReplyDelete
    Replies
    1. Hmm hota hai just body ke baad but this is not important

      Delete
  5. This comment has been removed by the author.

    ReplyDelete
  6. Ayan vatsa why are you saying thankyou to me...

    ReplyDelete
  7. Excellent post. You have shared some wonderful tips. I completely agree with you that it is important for any blogger to help their visitors. If anybody needs best website builder for your business Visit
    white label website builder

    white label website builder reseller

    ReplyDelete

Post a Comment

Hello students
If you have any doubt then let me know.

Popular posts from this blog

Administration of the Internet

FUNDAMENTAL OF COMPUTER