Challenging Cycle Sheet

Challenging cycle sheet
Name: Nithish S
Reg no: 18BCA0051
Course Name: Web Development
Course code: ITA1007
1) HTML Text formatting exercises
a. Print the squares of the numbers 1 - 20. Each number should be on a
separate line, next to it the number 2 superscripted, an equal sign and the
result.
Code:
<HTML>
<HEAD><TITLE>SQUARE NUMBERS</TITLE>
</HEAD>
<BODY>
<H3 ALIGN="CENTER"><FONT COLOR="RED">SQUARE OF NUMBERS FROM 1 TO 20</H3>
<H5 ALIGN="LEFT">1<SUP>2</SUP>=1</H5>
</BODY>
</HTML>
OUTPUT:
B. Print two lists with any information you want. One list should be an ordered list,
the other list should be an unordered list
Code:
<HTML>
<HEAD><ORDER AND UNORDER</TITLE>
</HEAD>
<BODY>
<H1 ALIGN="CENTER">ORDER LIST</H1>
<OL TYPE="I">
<LI>ONE</LI>
<LI>TWO</LI>
<LI>THREE</LI>
</OL>
<H1 ALIGN="CENTER">UNORDER LIST</H1>
<UL TYPE="CIRCLE">
<LI>ONE</LI>
<LI>TWO</LI>
<LI>THREE</LI>
</UL>
</BODY>
</HTML>
OUTPUT:
C. Print a list which starts with 7 with the type i
Code:
<HTML>
<HEAD><LIST STARTS WITH 7</TITLE>
</HEAD>
<BODY>
<H3 ALIGN="LEFT">ORDER 7</H3>
<OL TYPE="i" start="7">
<LI>Dosa</LI>
<LI>Idly</LI>
<LI>Poori</LI>
<LI>Pongal</LI>
<LI>Chappathi</LI>
<LI>Parota</LI>
<LI>Meals</LI>
<LI>Pizza</LI>
</OL>
</BODY>
</HTML>
OUTPUT:
D. Prints an h1 level heading followed by a horizontal line whose width is 100%.

Below the horizontal line print a paragraph relating to the text in the
heading.
Code:
<HTML>
<HEAD><TITLE>HORIZONTAL PARA LINE</TITLE>
</HEAD>
<BODY>
<H1 ALIGN="CENTER">MY DETAILS</H1>
<HR WIDTH="100"></HR>
<p>Im Nithish from Vellore and I'm studying in VIT since 1 year and my Phone number is
9943438382</p>
</BODY>
</HTML>
OUTPUT:
E. Print a definition list with 5 items
Code:
<HTML>
<HEAD><TITLE>DEFINITION LIST</TITLE>
</HEAD>
<BODY>
<H1 ALIGN="CENTER"> DEFINITION</H1>
<DL>
<DT>HTTP</DT>
<DD>HYPER TEXT TRANSFER PROTOCOL</DD>
<DT>HTML</DT>
<DD>HYPER TEXT MARKUP LANGUAGE</DD>
<DT>CAD</DT>
<DD>COMMON AIDED DESIGN</DD>
<DT>TCP</DT>
<DD>TRANSFER CONTROL PROTOCOL</DD>
<DT>DCF</DT>
<DD>DIGITAL COMPUTER FUNDAMENTALS</DD>
</DL>
</BODY>
</HTML>
OUTPUT:
F. Print two addresses in the same format used on the front of envelopes (senders
address in top left corner, receivers address in the center)
Code:
<HTML>
<HEAD><TITLE>ADDRESS ON ENVELOPE</TITLE>
</HEAD>
<BODY BGCOLOR="WHITE">
<H3 ALIGN="LEFT">SENDER ADDRESS</H3>
<H4 ALIGN="LEFT">NITHISH</H4>
<H4 ALIGN="LEFT">NO.5/1 MADHI NAGAR</H4>
<H4 ALIGN="LEFT">KATTPADI</H4>
<H4 ALIGN="LEFT">VELLORE 631001</H4>
<H4 ALIGN="LEFT">VELLORE </H4><BR>

<H3 ALIGN="CENTER">RECEIVER ADDRESS</H3>
<H4 ALIGN="CENTER">PRAVEEN</H4>
<H4 ALIGN="CENTER">NO.108 GANDHI NAGAR</H4>
<H4 ALIGN="CENTER">VELLORE 631001</H4>
<H4 ALIGN="CENTER">VELLORE</H4>
</BODY>
</HTML>
OUTPUT:
G. Print ten acronyms and abbreviations of your choosing, each

separated by two lines. Specify the data that the abbreviations
and acronyms represent.
Code:
<HTML>
<HEAD><TITLE>ABBREVATIONS</TITLE>
</HEAD>
<BODY BGCOLOR="WHITE">
<H1 ALIGN="CENTER">ABBREVATIONS</H1>
<DL><DT>HTTP</DT>
<DD>HYPERTEXT TRANSFER PROTOCOL</DD><BR>
<DT>HTML</DT>
<DD>HYPERTEXT MARKUP LANGUAGE</DD><BR>
<DT>AIDS</DT>
<DD>AQUIRED IMMUNO DEFICIENCY DISEASE</DD><BR>
<DT>GK</DT>
<DD>GENERAL KNOWNLEDGE</DD><BR>
<DT>MAT</DT>
<DD>MATHS</DD><BR>
<DT>UNO</DT>
<DD>UNITED NATIONS ORGANISATIONS</DD><BR>
<DT>IMG</DT>
<DD>IMAGE</DD><BR>
<DT>JPEG</DT>
<DD>JOINT PICTURES EXPERTS GROUP</DD><BR>
</DL>
</BODY>
</HTML>
OUTPUT:
2. HTML IMAGE EXERCISES
A. Display five different images. Skip two lines between each image. Each image
should have a title.
Code:
<html>
<head><title>Five images</title>
</head>
<body bgcolor="blue">
<h1 align="center">Apple</h1>
<img src="apple.jpg"alt="Apple"title="Apple"/>
<br><br>
<h1>Orange</h1>
<img src="orange.jpg"alt="Orange"title="Orange"/>
<br><br>
<h1>Bike</h1>
<img src="bike.jpg"alt="Bike"title="Bike"/>
<br><br>
<h1>Car</h1>
<img src="Car.jpg"alt="Car"title="Car"/>
<br><br>
<h1>Lorry</h1>
<img src="Lorry.jpg"alt="Lorry"title="Lorry"/>
<br><br>
</body>
</html>
OUTPUT:
B. Display an image that has a border of size 2, a width of 200, and a height of 200.
Code:
<html>
<head><title>image size fixing</title>
<body>
<h1 align="center"><font color="red">MY Laptop</h1>
<img src="laptop.jpg" width="200" height="200" alt="laptop" border="2"/>
</body>
</html>
OUTPUT:
C. Display the image towards the right corner of the webpage
Code:
<html>
<head><title>TOP RIGHT</title>
</head>
<body>
<img src="Train.jpg" width="300" height="200" align="right">
</body>
</html>
OUTPUT:
3) Program to illustrate Nested ordered list and Definition lists
Code:
<HTML>
<HEAD><TITLE>NESTED ORDER</TITLE>
</HEAD>
<BODY>
<OL TYPE="a">
<LI>Solid gray banner along the top of the browser window
<OL TYPE="i">
<LI>COMPANY LOGO</LI>
<LI>PRODUCT IMAGE</LI></OL>
</LI>
<LI> A text-based navigation menu
<OL TYPE="i">
<LI>Links to each of the sites web documents</LI></OL>
</LI>
<LI> a CONTENT AREA
<OL TYPE="i">
<LI>A heading that identifies page content
</LI>
<LI>A paragraph for displaying content
</LI>
<LI>A copyright notice</LI>
</LI>
</OL>
</OL>
</BODY>
</HTML>
OUTPUT:
II. Create the following list using HTML
Code:
<HTML>
<HEAD><TITLE>ORDERED NESTED</TITLE>
</HEAD>
<BODY>
<H1><FONT>An ordered nested list</H1>
<OL TYPE="1">
<LI>COFFEE</LI>
<LI>TEA
<OL TYPE="a">
<LI>BLACK TEA</LI>
<LI>GREEN TEA
<OL TYPE="i">
<LI>CHINA</LI>
<LI>AFRICA</LI>
</OL></OL>
</LI>
<LI>MIlk</LI>
<H1><FONT COLOR="WHITE">A DEFINITION list</H1>
<DL><DT>BANGALORE</DT>
<DD>CAPITAL CITY OF KARNATAKA</DD>
<DT>MUMBAI</DT>
<DD>CAPITAL CITY OF MAHARASHTRA</DD>
</BODY>
</HTML>
OTUPUT:
III. Create the following list using HTML tags
Code:
<HTML>
<HEAD><TITLE>PRACTICE</TITLE>
</HEAD>
<BODY BGCOLOR="BLACK">
<H1><FONT COLOR="WHITE">LIST EXAMPLES</H1>
<H3>This is an unorder list</H3>
<UL TYPE="disc">
<LI>LIST ITEM 1</LI>

</UL>
<H3>This is an order list</H3>
<OL TYPE="1">
</OL>
<H3>This is an ordered list strating at 10 and in upper-case roman numerals</H3>
<OL TYPE="I" START="X">
</OL>
<H3>This is an Unordered list nested within an ordered list </H3>
<OL TYPE="1">
<LI>WALK THE DOG</LI>
<LI>WASH THE CAR</LI>
<LI>GET GROCERIES
<UL TYPE="CIRCLE">
<LI>GROUND BEEF</LI>
<LI>MOZZARELLA</LI>
<LI>LASAGNA NOODLES</LI>
<LI>PASTA SAUCE</LI>
<LI>RICOTTA CHEESE</LI></UL>
</LI>
<LI>CLEAN THE House</LI>
<LI>Take out garbage</LI>
</OL>
</BODY>
</HTML>
OUTPUT:
5. HTML TABLE EXERCISES
Create the following tables using HTML code.
A. Pick 5 corporations and hunt down their current stock prices.

i) Place them in a neatly arranged table with their name, symbol, last price, 52wk high,
52wk low and PE ratio.
ii) The end result should look like the following. Notice that the first column is aligned left
and the rest are centered.
iii) Now alter the last table with dashed line with red color.
Code:
<html>
<head>
<title>Table</title>
</head>
<body>
<table border="3">
<tr>
<th colspan="6">My tech stock picks</th>
</tr>
<tr>
<th align="left" cellspacing="30">NAME</th>
<th align="Center">SYMBOL</th>
<th align="Center">CURRENT</th>
<th align="Center">52WK HI</th>
<th align="Center">52WK LO</th>
<th align="Center">P/E RATIO</th>
</tr>
<tr>
<td>Microsoft</td>
<td>MFST</td>
<td>86-3/8</td>
<td>119-15/16</td>
<td>75-1/2</td>
<td>56.09</td>
</tr>
<tr>
<td>Cisco Systems</td>
<td>CSCO</td>
<td>72-1/8</td>
<td>82</td>
<td>24-13/16</td>
<td>400.69</td>
</tr>
<tr>
<td>American Online</td>
<td>AOL</td>
<td>63</td>
<td>95-13/16</td>
<td>38-15/32</td>
<td>350.00</td>
</tr>
<tr>
<td>Qwest Communications</td>
<td>Q</td>
<td>44-7/16</td>
<td>66</td>
<td>25-3/4</td>
<td>74.06</td>
</tr>
<tr>
<td>DELL Computers</td>
<td>DELL</td>
<td>53-59/64</td>
<td>59-11/16</td>
<td>31-3/8</td>
<td>86.97</td>
</tr>
</table>
</body>
</html>
OUTPUT:
B. List of Fruits
Code:
<html>
<head>
<title></title>
</head>
<body>
<table border="2" bordercolor="black" cellpadding="30">
<tr>
<th colspan="2" align="center">FRESH FRUITS</th>
</tr>
<tr>
<td>It has long been known that a diet</br>
that includes at least a few servings </br>of fresh fruit
every day will help</br> keep you healthy, fit and trim.</td>
<td><img src="Fruits.jpeg" height="100"></td>
</tr>
</table>
</body>
</html>
OUTPUT:
C. Time Table
Code:
<html>
<head>
<title>Table</title>
</head>
<body>
<table border="2" ALIGN="CENTER"><caption>My TimeTable</caption>
<tr>
<th align="Center"></th>
<th align="Center">8.30-9.30</th>
</tr>
<tr align="center">
<td>Monday</td>
<td>---</td>
<td><font color="blue">SUB1</td>
<td><font color="pink">SUB2</td>
<td><font color="red">SUB3</td>
<td rowspan="6">Seminar</td>
<td><font color="brown">SUB4</td>
<td><font color="maroon">SUB5</td>
<td>Counselling Class</td>
</tr>
<tr align="center">
<td>Tuesday</td>
<td>---</td>
<td><font color="yellow">SUB4</td>
<td>Library</td>
</tr>
<tr align="center">
<td>Wednesday</td>
<td><font color="maroon">SWA</td>
<td>---</td>
<th colspan="3"><font color="lime">Lab</th>
</tr>
<tr align="center">
<td>Thursday</td>
<td><font color="green">SUB1</td>
<td><font color="Yellow">SUB3</td>
<td>---</td>
<td>Library</td>
</tr>
<tr align="center">
<td>Friday</td>
<td>---</td>
<td>Library</td>
</tr>
<tr align="center">
<td>Saturday</td>
<th colspan="3">Seminar</th>
<td>Library</td>
</tr>
</table>
</body>
</html>
OUTPUT:
5. HTML LINK EXERCISES
A. Create links to five different already created pages.
Code:
<HTML>
<HEAD><TITLE>FIVE LINKS</TITLE>
</HEAD>
<BODY BGCOLOR="BLACK">
<H1 ALIGN="CENTER"><FONT COLOR="WHITE">SELECT THE LINK THAT YOU WANT</H1>
<a href="ADDRESS.html">ADDRESS</a></br>
<a href="DEFINED LIST.HTML">DEFINED LIST</a></br>
<a href="DEFINITION.html">DEFINITION</a></br>
<a href="HORIZONTAL LINE.html">HORI LINE</a></br>
<a href="LIST EG.html">LIST EG</a></br>
</BODY>
</HTML>
OUTPUT:
B. Create a page with a link at the top of it that when clicked will jump all the
way to the bottom of the page. At the bottom of the page there should be a
link to jump back to the top of the page.
Code:
<html>
<body>
<a name="top">The top of the page</a>
<a href="#bottom">Click here to jump to the bottom of the page</a>
<p>Some text</p>
<p>Some text</p>
<p>Some text</p>
<p>Some text</p>
<p>Some text</p>
<p>Some text</p>
<p>Some text</p>
<p>Some text</p>
<p>Some text</p>
<p>Some text</p>
<p>Some text</p>
<p>Some text</p>
<p>Some text</p>
<p>Some text</p>
<p>Some text</p>
<p>Some text</p>
<p>Some text</p>
<a name="bottom">The bottom of the page</a>
<a href="#top">Click here to jump to the top of the page</a>
</body>
</html>
OUTPUT:
C. Write an HTML code to create a Home page having three links: About Us, Our
Services and Contact Us. Create separate web pages for the three links.
Code:
<HTML>
<HEAD><TITLE>Cinemas</TITLE>
</HEAD>
<BODY>
<H1 ALIGN="CENTER">Welcome to SPICinemas</H1>
<ul type="circle">
<li><a href="aboutus.html">About</a></li></br>
<li><a href="Ourservices.HTML">Our Services</a></li></br>
<li><a href="ContactUS.html">ContactUS</a></li></br>
</BODY>
</HTML>
OUTPUT:
About us.html:
<html>
<head><title>AboutUS</title></head>
<body>
<h1 align="left"><fontcolor="black">AboutUS</h1>
<h3 align="left">WELCOME TO SPI CINEMAS</h3>

<p>Coming from Chennai, that has a rich legacy of cinema,
we are a theatre chain with a passion for experiences and an even bigger passion
to share them with our customers. We understand the joy of watching our favourite
stories come alive on the big screen, and believe that it is our duty to go the extra
mile to make this experience as immersive as we possibly can! Our eight brands,
Sathyam, Escape, Palazzo, Aura, Le Reve,
The Cinema, S2 and Kripa each offer spaces and experiences that are exclusive.</p>
<h3 align="left">OUR STORY</h3>
<p>It all started in 1974 when we acquired ‘The Royal Theatre Complex’ from the Raja
of
Venkatagiri and
renamed it Sathyam Cinemas (after 1000+ seater in the complex). After about 25 years,
in 1999, talks were on to
demolish the then 3 screen multiplex and build an apartment complex. It was at this
time that our now CEO Mr. Kiran Reddy,
suggested that instead of taking down the cinema, we try something different!</p>
</body>
</html>
OUTPUT:
Contact us.html:
<html>
<head><title>ContactUS</title></head>
<body bgcolor="Grey">
<h1 align="left"><fontcolor="black">Contact</h1>
<p>Customer Care: help@spicinemas.in | For Movie Information and Door Delivery
(feature available only in Chennai), call: 044 4224 4224</p>
</body>
</html>
OUTPUT:
Our service.html:
<html>
<head><title>OurServices</title></head>
<body bgcolor="Grey">
<h1 align="left"><fontcolor="black">Service and support</h1>
<h3 align="left">OUR VISION</h3>
<p>At SPI CINEMAS, we believe in bringing people together to enjoy the ultimate
entertainment experience.
We urge our customers to demand more from entertainment and
we work together to deliver a 360° entertainment experience like no other. Within
our stunning environments,
we continually strive to bring our customers the latest innovations in sound and vision,
adrenalin- rush gaming,
delicious dining or pure relaxation in our spa. It's in our DNA.
Each of our five unique cinema brands belongs to the SPI Cinemas mother brand.
And whilst each one is clearly unique and individually defined, they all deliver the same
guarantee of the very highest quality and an unrivalled experience.</p>
</body>
</html>
OUTPUT:
5. HTML FORM EXERCISE
A. Design the following form using HTML
Code:
<!DOCTYPE html>
<html><head>
<title></title></head>
<body>
<form>
<table border="2">
<tr><th colspan="2">Pizza Shop 2.0</th></tr>
<tr>
<td>Name</td><td><input type="text" name="name"></input></td></tr>
<tr>
<td>Pizza Topping</td><td><input type="radio" name="topping"
value="supreme">Supreme</input></br>
<input type="radio" name="topping" value="vegetarian">Vegetarian</input></br>
<input type="radio" name="topping" value="hawaiian">Hawaiian</input></td></tr>
<tr>
<td>Pizza Sauce</td>
<td><select name="sauce">
<option value="tomato">Tomato</option>
<option value="barbeque">Barbeque</option>
<option value="mayonnaise">Mayonnaise</option>
<option value="secret">Secret Sauce</option>
</select></td></tr>
<tr>
<td>Optional Extras</td><td><input type="checkbox" name="extra_cheese" value="1">Extra
Cheese</input>
<input type="checkbox" name="gluten_free" value="1">Gluten Free Base</input></td>
</tr>
<tr>
<td>Delivery Instructions</td><td><textarea name="delivery" cols="50" rows="4"
required></textarea></td>
<tr><th><input type="submit" value="Send my Order"></th></tr>
</table>
</form>
</body>
</html>
OUTPUT:
B. Design a student registration form which takes student name, register number, DOB,
program, email id, temporary address, permanent address, phone number.
Code:
<!DOCTYPE HTML>
<html>
<head>
<title>Register Form</title>
</head>
<body>
<form>
<table>
<tr><td><h1 align="left"><b>Student registration form</b><h1></td></tr>
<tr>
<td>Name :</td>
<td><input type="text"required/></td>
</tr>
<tr>
<td>Register number :</td>
<td><input type="text"></td>
</tr>
<tr>
<td>DOB:</td>
<td>
<input type="date" name="DOB">
</td>
</tr>
<tr>
<td>Program:</td>
<td><select name="Program">
<option value="BCA">BCA</option>
<option value="MCA">MCA</option>
<option value="B.tech">B.tech</option>
<option value="M.tech">M.tech</option>
</select></td>
</tr>
<td>Temporary address</td><td><textarea name="temporary address" cols="50"

rows="4"></textarea></td>
<tr>
<td>Permanent address</td><td><textarea name="Permanent address" cols="50"
rows="4"></textarea></td><tr>
<tr>
<td>Email :</td>
<td><input type="email"required/></td>
</tr>
<tr>
<td>Phone no :</td>
<td>
<select>
<option>91</option>
<option>044</option>
</select>
<input type="phone">
</td>
</tr>
<tr>
<td><input type="submit" value="Submit"></td>
</tr>
</table>
</form>
</body>
</html>
OUTPUT:
7.HTML FRAME EXERCISES
Develop static pages (using Only HTML) of an online Book store. The pages should resemble:
www.amazon.com. The website should consist of the following pages.
 Home page
 Registration and user Login
 User Profile Page
 Books catalogue
 Shopping Cart
 Payment By credit card
 Order Conformation
Write an html program to generate a webpage that can give the overall information about that
website
Left.html :
<html>
<head><title>left</title>
</head>
<body>
<h3>
<ul>
<li><a href="login.html" target="right"><font color="blue">User Login</li><br>
<li><a href="userprofile.html" target="right">User Profile</li><br>
<li><a href="bookscatalog.html" target="right">Books Catalog</li><br>
<li><a href="shoppingcart.html" target="right">Shopping CART</li><br>
<li><a href="orderconformation.html" target="right">Order Conformation</li><br>
<li><a href="payment.html" target="right">Payment</li></ul>
</body>
</html>
OUTPUT:
Log-in.html :
<html>
<head><title>login</title></head>
<body background="sky.jpg">
<h2 align="center"><font color="white">USER LOGIN FORM</h2>
<h4 align="center"><u>Alread HAVE AN ID "LOGIN" OTHERWISE
"REGISTER"</u><h4>
<form>
<h3 align="center">User ID :<input type="text"></input></h3>
<h3 align="center">Password :<input type="password"></input></h3><br>
<h4 align="center"><a href="right.html">HOME</a>
<input type="submit" value="Login"><a href="register.html">REGISTER</h4>
</body>
</html>
Register.html :
<html>
<head><title>Register</title>
</head>
<body background="sky1.jpg">
<h2 align="center"><font color="violet">* * REGISTRATION * *</h2>
<HR WIDTH="1000"></HR>
<form>
<table align="center">
<tr>
<td><font color="white">NAME:</td><td><input type="text"></td>
<tr><td><font color="white">GENDER:</td><td><input type="radio"
value="Male">Male</input>
<input type="radio" value="Female">Female</input></td></tr>
tr>
<td><font color="white">OCCUPATION:</td>
<td><select occupation>
<option>Student</option>
<option>Worker</option>
<option>Teacher</option>
</select></tr>
<tr>
<td><font color="white">ADDRESS:</td><td><textarea cols="30"
rows="5"></textarea>
</tr>
<tr><td><font color="white">PHONE:</td>
<td><input type="phone"/><td></tr>
<tr><td><font color="white">EMAIL ID:</td>
<td><input type="email"/><td></tr>
<tr><td><font color="white">HOBBIES:</td>
<td><input type="checkbox">Browsing</input>
<input type="checkbox">Reading Books</input>
<input type="checkbox">Driving</input>
<input type="checkbox">Gardening</input>
<td></tr>
<tr><td><font color="white">User ID :</td><td><input type="text"></input></td>
</tr>
<tr><td><font color="white">Password :</td><td><input
type="password"></input></td>
</tr>
<tr>
<td><font color="white">RETYPE PASSWORD :</td><td><input
type="password"></input></td>
</tr>
</table>
<h4 align="center"><a href="login.html">BACK</a><input type="submit"
value="Submit"/>
<input type="Reset" value="Reset"/>
</form>
</body>
</html>
Main.html :
<html>
<head><title></title>
</head>
<frameset rows="25%,75%">
<frame src="top.html" name="top">
<frameset cols="35%,65%">
<frame src="left.html" name="left">
<frame src="right.html" name="right">
</frameset>
</frameset>
</html>
OUTPUT:

Challenging Cycle Sheet

Diunggah oleh

Informasi Dokumen

Hak Cipta

Format Tersedia

Bagikan dokumen Ini

Bagikan atau Tanam Dokumen

Opsi Berbagi

Apakah menurut Anda dokumen ini bermanfaat?

Apakah konten ini tidak pantas?

Hak Cipta:

Format Tersedia

Challenging Cycle Sheet

Diunggah oleh

Hak Cipta:

Format Tersedia

Challenging cycle sheet

<H3 ALIGN="CENTER"><FONT COLOR="RED">SQUARE OF NUMBERS FROM 1 TO 20</H3>

<HEAD><ORDER AND UNORDER</TITLE>

<H1 ALIGN="CENTER">ORDER LIST</H1>

<H1 ALIGN="CENTER">UNORDER LIST</H1>

C. Print a list which starts with 7 with the type i

<HEAD><LIST STARTS WITH 7</TITLE>

<H3 ALIGN="LEFT">ORDER 7</H3>

<OL TYPE="i" start="7">

D. Prints an h1 level heading followed by a horizontal line whose width is 100%.

<H1 ALIGN="CENTER">MY DETAILS</H1>

E. Print a definition list with 5 items

<H1 ALIGN="CENTER"> DEFINITION</H1>

<DD>HYPER TEXT TRANSFER PROTOCOL</DD>

<DD>HYPER TEXT MARKUP LANGUAGE</DD>

<DD>COMMON AIDED DESIGN</DD>

<DD>TRANSFER CONTROL PROTOCOL</DD>

<DD>DIGITAL COMPUTER FUNDAMENTALS</DD>

<H3 ALIGN="LEFT">SENDER ADDRESS</H3>

<H4 ALIGN="LEFT">NO.5/1 MADHI NAGAR</H4>

<H4 ALIGN="LEFT">VELLORE 631001</H4>

<H4 ALIGN="LEFT">VELLORE </H4><BR>

<H4 ALIGN="CENTER">NO.108 GANDHI NAGAR</H4>

<H4 ALIGN="CENTER">VELLORE 631001</H4>

G. Print ten acronyms and abbreviations of your choosing, each

<DD>HYPERTEXT TRANSFER PROTOCOL</DD><BR>

<DD>HYPERTEXT MARKUP LANGUAGE</DD><BR>

<DD>AQUIRED IMMUNO DEFICIENCY DISEASE</DD><BR>

<DD>UNITED NATIONS ORGANISATIONS</DD><BR>

<DD>JOINT PICTURES EXPERTS GROUP</DD><BR>

2. HTML IMAGE EXERCISES

<head><title>image size fixing</title>

<h1 align="center"><font color="red">MY Laptop</h1>

<img src="laptop.jpg" width="200" height="200" alt="laptop" border="2"/>

C. Display the image towards the right corner of the webpage

<img src="Train.jpg" width="300" height="200" align="right">

3) Program to illustrate Nested ordered list and Definition lists

<LI>Solid gray banner along the top of the browser window

<LI> A text-based navigation menu

<LI>Links to each of the sites web documents</LI></OL>

<LI> a CONTENT AREA

<LI>A heading that identifies page content

<LI>A paragraph for displaying content

<LI>A copyright notice</LI>

II. Create the following list using HTML

<H1><FONT>An ordered nested list</H1>

<H1><FONT COLOR="WHITE">A DEFINITION list</H1>

<DD>CAPITAL CITY OF KARNATAKA</DD>

<DD>CAPITAL CITY OF MAHARASHTRA</DD>

III. Create the following list using HTML tags

<H1><FONT COLOR="WHITE">LIST EXAMPLES</H1>

<H3>This is an unorder list</H3>

<LI>LIST ITEM 1</LI>

<LI>LIST ITEM 2</LI>

<LI>LIST ITEM 3</LI>

<H3>This is an order list</H3>

<LI>LIST ITEM 1</LI>

<LI>LIST ITEM 2</LI>

<LI>LIST ITEM 3</LI>

<H3>This is an ordered list strating at 10 and in upper-case roman numerals</H3>

<OL TYPE="I" START="X">

<LI>LIST ITEM 1</LI>

<LI>LIST ITEM 2</LI>

<LI>LIST ITEM 3</LI>