You are on page 1of 14

Controlling how Ordered lists are

Displayed
The type attribute allows you to specify
the number type for an OL.
Specifying the number type: The
values that you can use with the TYPE
attribute are “A”, “a”, “ I ”, “ i ”, and “
1” for specifying uppercase letters,
lowercase letters, uppercase roman
Web Development & Resource Mgmt. 1

<LI> This is item two. <LI> This is item three. </OL> Web Development & Resource Mgmt.Example: <OL TYPE=“I”> <LI>This is item one. 2 .

3 .<HTML> <HEAD> <TITLE>ABCD</TITLE> </HEAD> <BODY> <OL TYPE=“1”> <LI>LEVEL ONE OUTLINE LEVEL <OL TYPE=“A”> <LI> LEVEL TWO OUTLINE LEVEL <OL TYPE=“1”> <LI> LEVEL THREE OUTLINE LEVEL <LI> LEVEL FOUR OUTLINE LEVEL </OL> <LI> LEVEL THREE OUTLINE LEVEL </OL> <LI> LEVEL TWO OUTLINE LEVEL </OL> </BODY> </HTML> Web Development & Resource Mgmt.

4 . “circle” and “square”. The values that you can use with the TYPE attribute are “disc”. Web Development & Resource Mgmt. Controlling the display of Unordered list Specifying a bullet type: The TYPE attribute can be used to specify the type of bullet for an unordered list.

5 .Example: <HEAD> <TITLE> ABC</TITLE> </HEAD> <BODY> <UL TYPE=“SQUARE”> <LI>SOFTWARE <UL TYPE=“DISC”> <LI> MS-WINDOWS <LI> MS-EXCEL </UL> <LI> HARDWARE <UL TYPE=“CIRCLE”> <LI>CPU <LI>INPUT DEVICES </UL> </UL> </BODY> </HTML> Web Development & Resource Mgmt.

Syntax: <IMG SRC=“imagefile”> The SRC (source) attribute is a required attribute that identifies the full or partial address or just the name of the file to display. 6 . Example: <IMG SRC=“flowers.Inserting Images The IMG (Image) tag allows you to display images on your web page.gif”> Web Development & Resource Mgmt.

Using the ALIGN attribute The ALIGN attribute allows you to position an image relative to the line of text that it is on.gif” is middle aligned.gif” is top aligned. <P>The image on this line <IMG ALIGN=“BOTTOM” SRC=“flower.gif” Web Development & Resource Mgmt. <P>The image on this line <IMG ALIGN=“MIDDLE” SRC=“flower. is7 . “middle” and “bottom”. Example: <P>The image on this line <IMG ALIGN=“TOP” SRC=“flower. All current graphical web browser recognize these values: “top”.

GIF” WIDTH=“100%”> The height of the image will also be resized correspondingly. Example: <IMG SRC=“FLOWER.Setting the Height and Width of Image The height and width of an image can be specified. Web Development & Resource Mgmt. 8 .

The STRIKE command is more limited to using the Web in workgroup document preparation processes. U (Underline) and STRIKE (Strikethrough) tags. SUB (Subscript). TheWeb U Development tags is& Resource usedMgmt. including the SUP (Superscripts). The SUP and SUB tags are highly useful tags that you should use wherever you need superscripts or subscripts.Text Highlighting Tags HTML recognizes a number of additional character rendering tags. rather than for displaying final renditions. for underline a9 .

10 . </SUB <U> Use U for underlining.Example: <HTML> <HEAD><TITLE> ABC </TITLE> </HEAD> <BODY> <SUP> Use SUP for Superscripts. </SUP> <SUB> Use SUB for subscripts. </U> <STRIKE> Use Strike for Strikethrough </STRIKE> </BODY> </HTML> Web Development & Resource Mgmt.

headings.Text Alignment You can align paragraphs. right-align. or left-align these elements. Using the ALIGN Attribute in Heading and Paragraphs Example: To center align a level-two heading <H2 ALIGN=“CENTER”> Your Heading Here </H2> To right-align level-two heading <H2 ALIGN=“RIGHT”> Your Heading Here</H2> Web Development & Resource Mgmt. and other document in a number of ways. Web Development & Resource Mgmt. You can use the ALIGN attribute with paragraphs or heading to center-align. 11 11 .

and the level-two heading above it.<BODY> <CENTER> <H2> Level-Two Heading</H2> <P> This paragraphs. 12 . <UL> <LI>First List item <LI> Second List Item </UL> </CENTER> </BODY> </HTML> Web Development & Resource Mgmt. is centered using the center tag.

Using a Background Image The background attribute of the BODY tag allows you to specify a background image. The general format for entering this attribute is as follows: <BODY BACKGROUND=“filename”> Web Development & Resource Mgmt. 13 . The graphic file for the background image can be a GIF or JPEG image.

gif”> Web Development & Resource Mgmt. 14 .Example: <BODY background=“c:\abc\flower.