Showing posts with label How to write program in html. Show all posts
Showing posts with label How to write program in html. Show all posts

List Element (Attribute with Ordered List)

In earlier post we have seen List element with out any attribute and that was the reason it took 1,2,3.. etc as default. We can set from which number the list element will start.

Format:

<OL Start="Number">.....</OL>

Now we will rewite the same code as earlier programe and use the new tag

<HTML>
<HEAD>
<Title> List Element Example</Title>
</HEAD>
<BODY>
    <H1> 3 Angle Software</H1>
    <P> <STRONG> Courses in 3 Angle Software</STRONG></P>
        <OL>
            <LI>Programming in C
            <LI>Programming in C++
            <LI>Visual Programming
            <LI>Java Programming
            <LI>Web Designing
        </OL>
       
    <P> Multimedia Courses</P>
        <OL START="6">
            <LI>Graphics Courses
            <LI>Editing Courses
            <LI>2D Animation Courses
        </OL>   
</BODY>
</HTML>
        Now we need to save this as we did earlier and then if we run it we will get a result like bellow image


 
I hope this will help you to understand, practice it and if you found any problem let me know in comment or email me in srv2013@gmail.com. Feel free to share if it helped you. Best of Luck

LIST Element

We covered few elements to make a web page. Now we will learn how to use LIST Element.

This is an example of List Element

We use this type of list in different purposes, such as Dictionary, Telephone guide, Address book, price list etc. We will learn different type of tags for Listing. There are mainly 3 types of LIST tag.

1. <OL> or listing with Number
2. <UL> of Unordered or bullet
3. <LI> this is used with  <OL> or <UL>

Except this there are Menu, Directory list, we will learn all gradually.

 Ordered List

In this list we can use 1,2,3 or A,B,C etc type of number to make list. this is why it also called as Numbered list. 

Format: <OL> ....... </OL>  and Items are divided with <LI>

Ordered List Example

 <HTML>
<HEAD>
<Title> List Element Example</Title>
</HEAD>
<BODY>
    <H1> 3 Angle Software</H1>
    <P> <STRONG> Courses in 3 Angle Software</STRONG></P>
        <OL>
            <LI>Programming in C
            <LI>Programming in C++
            <LI>Visual Programming
            <LI>Java Programming
            <LI>Web Designing
        </OL>
       
    <P> Multimedia Courses</P>
        <OL>
            <LI>Graphics Courses
            <LI>Editing Courses
            <LI>2D Animation Courses
        </OL>   
</BODY>
</HTML>



Now you have to go and save it like we did earlier, if you forgot please check here.  
 Now run it, you will get output like bellow image 
List Element Example

 As there is no attribute in the <LI> so it will take 1,2,3.. etc by default

It will continue..

I hope this will help you to understand, practice it and if you found any problem let me know in comment or email me in srv2013@gmail.com. Feel free to share if it helped you. Best of Luck

Horizontal Line Element

With this tag you can draw Horizontal line under document. Only in special occasion we need to use this one, for example after contact us details.

Format: <HR>

Code:

<HTML>
<HEAD>
<Title> Horizontal Line Element Example</Title>
</HEAD>
<BODY>
    <Address>
        3 Angle Softwares
        Scottsdale, Arizone, 85002
        Phone:1111111111
<HR>
<Address>
</BODY>
</HTML>

Save it, and then run  your program, If you dont know how to save then flow instruction here

 Result should be like this 


I hope this will help you to understand, practice it and if you found any problem let me know in comment or email me in srv2013@gmail.com. Feel free to share if it helped you. Best of Luck

BLOCKQUOTE ELEMENT

This tag used to quote some text of the webpage. It is almost like CENTER element, text is shown in middle. The format is
<BLOCKQUOTE>..............................<BLOCKQUOTE>

Example:

<HTML>
<HEAD>
<TITLE> This is BlockQUOTE Element Example </TITLE>
</HEAD>
<BODY>
Whether you are a seasond word user or a first timer, this book meets you at your current level and helps you grow from there.
<BLOCKQUOTE>
If you are already familier with HTML's functionality, you will find plenty of help to streamline and enhance your work
</BLOCKQUOTE>
</BODY>
</HTML>

BLOCKQUOTE ELEMENT EXAMPLE

If you do not know how to save your program then please visit another post to save it. That post link is Lets Start

I hope this will help you to understand, practice it and if you found any problem let me know in comment or email me in srv2013@gmail.com. Best of Luck

ADDRESS ELEMENT

Today we will see how to write your address using ADDRESS tag. It will show the address in a Italic font and easily determine as a different text. The tag is look like
<ADDRESS>......................................</ADDRESS>

Example:

<HTML>
<TITLE>
Address
</TITLE>
<BODY>
This Element essentially format an address section
<ADDRESS>
Davide Luis<BR>
Apple Velly, California<BR>
United States of America<BR>
Email: srv2013@gmail.com<BR>
website:1learners.blogspot.com
</ADDRESS>
</BODY>
</HTML>

We use <BR> for line break. We want to show new lines after each sentence that's why we use it, you may escape it and then it will show the address in same line.

Ask me anything if you face problems.

FONT COLOR ELEMENT

This tag is like FONT FACE and FONT SIZE element. Color can be declared by name like RED or GREEN or BLACK or you may use declare by decimal number which is decided for all the colors. This tag format is <FONT COLOR=(name or code of Color)>............................</FONT >

Example:

<HTML>
<HEAD>
<TITLE>
Program 9
</TITLE>
</HEAD>
<BODY>
<FONT COLOR=RED>This is my New Program</FONT>
<FONT COLOR=#FF0000>This is my new Program</FONT>
</BODY>
</HEAD>

Insert the tag in which paragraph or line you want to color. Just start it before the paragraph or sentence and end at the end of the paragraph. For you better understanding I am providing charts of color code, it may help you.

FONT FACE ELEMENT

Sometimes we change fonts in MS Words, here we can do the same thing. Its like FONT SIZE tag. The format is like  <FONT FACE=(name of the font)>.........</FONT>

Example:

<HTML>
<HEAD>
<TITLE>
Program 8
</TITLE>
</HEAD>
<BODY>
<FONT FACE="ARIAL"> This is my New Program</FONT>
<FONT FACE="IMPACT"> This is My New Program</FONT>
</BODY>
</HEAD>

For your better Understanding I am providing you some names of most popular fonts.


  1. academy engraved let
  1. algerian
  1. amaze
  1. arial
  1. arial black
  1. balthazar
  1. bankgothic lt bt
  1. bart
  1. bimini
  1. comic sans ms
  1. book antiqua
  1. bookman old style
  1. braggadocio
  1. britannic bold
  1. brush script mt
  1. century gothic
  1. century schoolbook
  1. chasm
  1. chicago
  1. colonna mt
  1. comic sans ms
  1. commercialscript bt
  1. coolsville
  1. courier
  1. courier new
  1. cursive
  1. dayton
  1. desdemona
  1. fantasy
  1. flat brush
  1. footlight mt light
  1. futurablack bt
  1. futuralight bt
  1. garamond
  1. gaze
  1. geneva
  1. georgia
  1. geotype tt
  1. (*above: Geotype TT)
  1. helterskelter
  1. helvetica
  1. herman
  1. highlight let
  1. impact
  1. jester
  1. joan
  1. john handy let
  1. jokerman let
  1. kelt
  1. kids
  1. kino mt
  1. la bamba let
  1. lithograph
  1. lucida console
  1. map symbols
  1. marlett
  1. (*above: Marlett)
  1. matteroffact
  1. matisse itc
  1. matura mt script capitals
  1. mekanik let
  1. (*above: mekanik let)
  1. monaco
  1. monospace
  1. monotype sorts
  1. ms linedraw
  1. new york
  1. olddreadfulno7 bt
  1. (*above: OldDreadfulNo7 BT)
  1. orange let
  1. palatino
  1. playbill
  1. pump demi bold let
  1. puppylike
  1. roland
  1. sans-serif
  1. scripts
  1. scruff let
  1. serif
  1. short hand
  1. signs normal
  1. (*above: Signs Normal)
  1. simplex
  1. simpson
  1. stylus bt
  1. superfrench
  1. surfer
  1. swis721 bt
  1. swis721 blkoul bt
  1. symap
  1. (*above: Symap)
  1. symbol
  1. (*above: symbol)
  1. tahoma
  1. technic
  1. tempus sans itc
  1. terk
  1. times
  1. times new roman
  1. trebuchet ms
  1. trendy
  1. txt
  1. verdana
  1. victorian let
  1. vineta bt
  1. vivian
  1. webdings
  1. (*above: Webdings)
  1. wingdings
  1. (*above: Wingdings)
  1. western
  1. westminster
  1. westwood let
  1. (*above: Westwood LET)
  1. wide latin
  1. zapfellipt bt
  1.  

If You cant understand anything don't forget to write me!!