Practical 1

Practical-1
Aim: Write HTML code to develop a web page with red background titled “My first page”
& give your details.
<html>
<head>
<title>My First Page</title>
</head>
<body bgcolor=red>
<b>
Hello everyone,
I am a student of Bachelor Engineer
</b>
</body>
</html>
EVALUATION:
Problem Understanding Timely Mock (2) Total (10)

Analysis& Level Completion (2)
Solution (3) (3)
Signature:
1
Practical-2
Aim: Create a page to show different attributes of font formatting tags.
<html>
<head>
<title>font formatting tags</title>
</head>
<body>
<font face="Lucida Handwriting">
This shows font face..
</font><br><br>
<font size="10">
This shows the size of the font.
</font><br><br>
<font color="FF0000">
This shows the color of the font.
</font>
</body>
</html>
EVALUATION:

Solution (3) (3)
Signature:
2
Practical-3
Aim: Write HTML document which display image in center and use link.
<html>
<head>
<title>Image Link</title>
</head>
<body>
<center>
<a href="1.html"><img src="road.jpg" alt="Image-link"></a>
</center>
</body>
</html>
EVALUATION:

Solution (3) (3)
Signature:
3
Practical-4
Aim: Write HTML document using different character entities.
<html>
<head>
<title>Character Entities</title>
</head>
<body>
<table border=3>
<tr>
<th align="left">Result</th>
<th align="left">Description</th>
<th align="left">Entity Name</th>
<th align="left">Entity Number</th>
</tr>
<tr>
<td> </td>
<td>non-breaking space</td>
<td> </td>
<td> </td>
</tr>
<tr>
<td><</td>
<td>less than</td>
<td><</td>
<td><</td>
</tr>
<tr>
<td>></td>
<td>greater than</td>
<td>></td>
<td>></td>
</tr>
<tr>
<td>&</td>
<td>ampersand</td>
<td>&</td>
<td>&</td>
</tr>
<tr>
4
<td>¢</td>
<td>cent</td>
<td>¢</td>
<td>¢</td>
</tr>
<tr>
<td>£</td>
<td>pound</td>
<td>£</td>
<td>£</td>
</tr>
<tr>
<td>¥</td>
<td>yen</td>
<td>¥</td>
<td>¥</td>
</tr>
<tr>
<td>€</td>
<td>euro</td>
<td>€</td>
<td>€</td>
</tr>
<tr>
<td>§</td>
<td>section</td>
<td>§</td>
<td>§</td>
</tr>
<tr>
<td>©</td>
<td>copyright</td>
<td>©</td>
<td>©</td>
</tr>
<tr>
<td>®</td>
<td>registered trademark</td>
<td>®</td>
<td>®</td>
</tr>
5
<tr>
<td>™</td>
<td>trademark</td>
<td>™</td>
<td>™</td>
</tr>
</table>
</body></html>
EVALUATION:

Solution (3) (3)
Signature:
6
Practical-5
Aim:
i. Create a webpage showing an ordered list of your five friends with different types.
<html>
<head>
<title>
Ordered list
</title>
</head>
<body>
<table border=1>
<tr>
<th colspan=5>Types of ordered list</th>
</tr>
<tr>
<th>1</th>
<th>i</th>
<th>A</th>
<th>a</th>
<th>I</th>
</tr>
<tr>
<td>
<ol type=1>
<li>Pratik</li>
<li>Brijesh</li>
<li>Gautam</li>
<li>Hardik</li>
<li>Ravindra</li>
</ol>
</td>
<td>
<ol type=i>
<li>Pratik</li>
<li>Brijesh</li>
<li>Gautam</li>
<li>Hardik</li>
<li>Ravindra</li>
</ol>
7
</td>
<td>
<ol type=A>
<li>Pratik</li>
<li>Brijesh</li>
<li>Gautam</li>
<li>Hardik</li>
<li>Ravindra</li>
</ol>
</td>
<td>
<ol type=a>
<li>Pratik</li>
<li>Brijesh</li>
<li>Gautam</li>
<li>Hardik</li>
<li>Ravindra</li>
</ol>
</td>
<td>
<ol type=I>
<li>Pratik</li>
<li>Brijesh</li>
<li>Gautam</li>
<li>Hardik</li>
<li>Ravindra</li>
</ol>
</td>
</tr>
</table>
</body>
</html>
8
EVALUATION:

Solution (3) (3)
Signature:
9
ii. Display restaurant menu with different category with their items using <DL> <DT>
<DD> tag.
<html>
<head>
<title>definition list </title>
</head>
<body>
<h4><u>A Definition List:</u></h4>
<dl>
<dt><b>Welcome drink</b></dt>
<dd>- jal jeera</dd>
<dt><b>Coffee</b></dt>
<dd>- black hot drink</dd>
<dt><b>Milk</b></dt>
<dd>- white cold drink</dd>
</dl>
</body>
</html>
EVALUATION:

Solution (3) (3)
Signature:
10
iii. Display and unordered list of name of your five friends with different type.
<html>
<head>
<title>
Unordered list
</title>
</head>
<body>
<table border=1>
<tr>
<th colspan=3>Types of unordered list</th>
</tr>
<tr>
<th>disk</th>
<th>square</th>
<th>circle</th>
</tr>
<tr>
<td>
<ul type=disk>
<li>Pratik</li>
<li>Brijesh</li>
<li>Gautam</li>
<li>Hardik</li>
<li>Ravindra</li>
</ul>
</td>
<td>
<ul type=square>
<li>Pratik</li>
<li>Brijesh</li>
<li>Gautam</li>
<li>Hardik</li>
<li>Ravindra</li>
</ul>
</td>
<td>
<ul type=circle>
<li>Pratik</li>
<li>Brijesh</li>
11
<li>Gautam</li>
<li>Hardik</li>
<li>Ravindra</li>
</ul>
</td>
</tr>
</table>
</body>
</html>
EVALUATION:

Solution (3) (3)
Signature:
12
Practical-6
Aim:
i. Write a HTML code to create a table.
<html>
<head>
<title>TABLE</title>
</head>
<body>
<table border=3>
<tr>
<th>Name:
<th>Enroll No.
<th>Email-ID
</tr>
<tr>
<td>ABC
<td>100020107050
<td>abc940@yahoo.com
</tr>
<tr>
<td>PQR
<td>100020107065
<td>pqrl_27@yahoo.com
</tr>
<tr>
<td>XYZ
<td>100020107057
<td>xyz_57@yahoo.com
</tr>
</table>
</body>
</html>
13
ii. Write an HTML code to create a Nested table.
<html>
<head>
<title>nested table</title>
</head>
<body>
<table border="1">
<tr>
<td>
<p>This is first cell</p>
</td>
<td>
<p>This is second cell</p>
</td>
</tr>
<tr>
<td>
<p>This is Third cell</p>
<table border="1">
<tr>
<td>one</td>
<td>Two</td>
</tr>
<tr>
<td>Three</td>
<td>Four</td>
</tr>
</table>
</td>
<td>
<p>This is forth cell</p>
</td>
<tr>
</table>
</body>
</html>
14
EVALUATION:

Solution (3) (3)
Signature:
15
Practical-7
Aim: Create a simple HTML form for Login in Div.
<html>
<head>
<title>Log in form</title>
</head>
<body>
<form>
<div align="center">
<table border=3>
<tr><th colspan=2>LOG IN FORM</tr>
<tr>
<td>E-mail
<td><input type=text name=email value="Enter your email id">
</tr>
<tr>
<td>Password
<td><input type=password name=p1 value="">
</tr>
<tr><td colspan=2><center><input type=button name=s1 value=SUBMIT>
<input type=reset name=r1 value=RESET></center></tr>
</table></div></form></body>
</html>
EVALUATION:

Solution (3) (3)
Signature:
16
Practical-8
Aim: Create a simple HTML form for Registration in Table.
<html>
<head>
<title>table</title>
</head>
<body>
<form>
<table border=3>
<tr>
<td colspan=4 align=center>Registration Form
</tr>
<tr>
<td>Name:
<td><input type="text" name=fname value="firstname">
<td><input type="text" name=lname value="lastname">
</tr>
<tr>
<td>Address:
<td><textarea rows=6 cols=15>
</textarea>
</tr>
<tr>
<td>Contact Number:
<td><input type="text" name=fname value="enter your number" maxlength=10>
</tr>
<tr>
<td>E-mail:
<td><input type="text" name=fname value="Enter your ID">
</tr>
<tr>
<td>Password:
<td><input type="password" name=fname value="">
</tr>
<tr>
<td>Date of Birth:
<td>Date:<select>
<option>1</option>
<option>2</option>
17
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
<option>10</option>
<option>11</option>
<option>12</option>
<option>13</option>
<option>14</option>
<option>15</option>
<option>16</option>
<option>17</option>
<option>18</option>
<option>19</option>
<option>20</option>
<option>21</option>
<option>22</option>
<option>23</option>
<option>24</option>
<option>25</option>
<option>26</option>
<option>27</option>
<option>28</option>
<option>29</option>
<option>30</option>
<option>31</option>
</select>
<td>Month:<select>
<option>January</option>
<option>February</option>
<option>March</option>
<option>April</option>
<option>May</option>
<option>June</option>
<option>July</option>
<option>August</option>
<option>September</option>
<option>October</option>
<option>November</option>
<option>December</option>
</select>
<td>Year:<select>
<option>2000</option>
18
</select>
</tr>
<tr>
<td>Gender:
<td><input type="radio" name=m1 value=male>Male
<td><input type="radio" name=m1 value=female>Female
</tr>
</table>
</form>
</body>
</html>
EVALUATION:

Solution (3) (3)
Signature:
19
Practical-9
Aim: Create a simple HTML form for feedback.
<html>
<head>
<title>feedback form</title>
</head>
<body>
<form>
<b>Your name:</b><br /><input type:"text" size="25" value=""><br><br>
<b>your email:</b><br /><input type:"text" size="25" value=""><br><br><br>
<b>your feedback:</b><br /><textarea cols="40" rows="5" name=""></textarea><br><br><br>
<input type="submit" valur="SUBMIT">
</form>
</body>
</html>
EVALUATION:

Solution (3) (3)
Signature:
20
Practical-10
Aim: Create a 3 page website for an organization.
<html>
<head>
<title> SAL Technologies </title>
</head>
<body>
<h1><u><b>
<center>SAL TECHNNOLOGIES</center>
</b></u></h2>
<h4><b>Welcome to SAL technologies>></b></h4>
<p>
SAL Technologies Is dealing with web designing, web development, IT solutions, corporate
identity and SEO work across the glob. Our dedicated, innovative and creative human forces have always
been striving for the best results in web development and maintenance. SAL Technologies is different in
terms of web designing, logo designing, corporate identity, Internet Marketing and IT solutions with its
combination of vast knowledgeable team and advanced technology.
</p>
<p>
We are specialized in providing the web designing services to the clients in diversified way. we
are glad to have the trust of ample number of satisfied clients with us.
</p>
<a href="service.html">Services </a><br>
<a href="contact.html">Contact us</a>
</body>
</html>
21
(service.html)
<html>
<head>
<title>
Services-SAL Technologies
</title>
</head>
<body>
<h2><b><u>Services provided:</u></b></h2>
<ul>
<li>Web Designing</li>
<li>Logo Designing</li>
<li>Template Design</li>
<li>Web Development</li>
<li>Portal Development</li>
<li>Web Hosting</li>
<li>S.E.O.</li>
<li>Internet Marketing</li>
<li>Content Writing</li>
<li>Corporate Presentation</li>
<li>B.P.O.</li>
</ul>
<a href="contact.html">Contact us </a>
<a href="demo.html"> Home</a>
</body>
</html>
22
(contact.html)
<html>
<head>
<title>
Contact us-SAL Technologies
</title>
</head>
<body>
<h2><b><u>Contact us:</u></b></h2>
<pre>
SAL TECHNOLOGIES
SAL Education Campus,
SAL College of Engineering,
Opp. Science city,
Sola Bhadaj Road,
Ahmedabad,Gujarat-380060.
</pre>
<b>Website: </b><a href="www.saltech.com">www.saltech.com</a><br>
<b>Inquiry: </b>info@saltech.com<br>
<b>Support: </b>support@saltech.com<br>
<b>Skype: </b>Saltech<br>
<br><a href="demo.html"> Home</a>
</body>
</html>
EVALUATION:

Solution (3) (3)
Signature:
23
Practical-11
Aim: Create a sample product website.
<html>
<head>
<title>Product description</title>
</head>
<body>
<table>
<tr>
<td>
<img src="samsung-galaxy-grand-i9082-275x275-
imadjr3pvdbmhgkz.jpeg" alt=Samsung grand hspace=50px vspace=50px>
</td>
<td>
<table>
<tr>
<h2><b>Samsung Galaxy Grand Duos I9082 (Elegant
White)</b></h2>
</tr>
<tr>
<ul type=disk>
<li>8 MP Primary Camera
<li>Android v4.1 OS
<li>5-inch Touchscreen
<li>Dual SIM (GSM + GSM)
<br><br>
<a href="specification.html"> Specifications </a>
</tr>
</table>
</td>
</table>
<b>
<h3>Samsung Galaxy Grand Duos I9082 (Elegant White) Price: Rs.20900</h3>
</b>
<b>Key Features:</b>
<ul type=disk>
<li>Android v4.1 (Jelly Bean) OS
<li>5-inch Capacitive Touchscreen
<li>8 MP Primary Camera and 2 MP Secondary Camera
<li>Full HD Recording
<li>Expandable Storage Capacity of 64 GB
<li>Multi Window
<li>Dual Standby SIM (GSM + GSM)
<li>1.2 GHz Dual Core Processor
<p>
The Samsung Galaxy Grand I9082 is an upcoming phone that is slated for an early 2013
release
24
in the Indian market. The Grand is a dual SIM phone that can support two separate GSM con-
nections. Until recently, dual SIM phones were grossly underpowered and battery capacities on
them were quite less. This is certainly not the case with the Samsung Galaxy Grand I9082. The
dual SIM phone has a powerful battery that can power the phone for more than a day on nor-
mal continuous use. The Grand by Samsung is set to revolutionize the market for Dual SIM
phones.
</p>
<p>
The Samsung Galaxy Grand I9082 is a versatile phone that boasts of an 8 MP primary camera
that is capable of some high resolution photos and video capture. The secondary front facing
camera is composed of an upgraded 2 MP camera. The primary camera is capable of Full High
Definition video recording at 1920 X 1080p at 30 frames per second. The quality can be adjust-
ed between HD ready to Full HD depending on the amount of space you want to be utilized for
each video file. The camera comes with an LED flash that is capable of illuminating your
subjects
quite adequately even in low light conditions to give you clear images.
</p>
<p>
Auto Focus, Geo-tagging, Touch Focus and Face detection are some of the advanced features
supported by the Samsung Galaxy Grand I9082. There is even an image stabilizer and smile
de-
tector that can help you take better, memorable pictures. There is a basic image editor present
in the Galaxy Grand that you can use to touch up your images once they have been clicked.
This
makes for a great tool for those slightly imperfect images that you do not wish to delete, allow-
ing you to save even more memories to the disk.
</p>
<p>
The power source of the Samsung Galaxy Grand I9082 is a massive 2100 mAh Li-Ion battery
that
is capable of powering your device for extended periods of time. The battery will last through
the day with light to moderate usage which would include listening to music, watching video
clips and taking a few photos with the 8 MP camera. Continuous video playback and music on
the Samsung Grand might drain the battery in a little more than half a day. The 5 inch screen
with a resolution of 480 X 800 pixels will certainly help in extending the operating duration of
this powerful device without compromising on picture quality. The Multi-touch screen is capa-
ble of 16 M colors.
</p>
<p>
The Samsung Galaxy Grand I9082 has a dual core 1.2 GHz processor and a RAM of 1 GB,
with an
internal memory of 8 GB which can be extended to another 64 GB by use of microSD cards.
The
device also supports internet connectivity through 2G and 3G, apart from Wi-Fi. Never get lost
25
with the built in A-GPS and GLONASS with Google Maps to guide you along the way. The
phone
runs on the latest Android Jellybean with OS version 4.1.2.
</p><a href="specification.html"> Specifications </a>
</body>
</html>
(specification .html)
<html>
<head>
<title>
Specification-Grand
</title>
</head>
<body>
<h3><b> Specifications of Samsung Galaxy Grand Duos I9082 (Elegant White)</b></h3>
<table border=1 cellspacing="0">

<tr>
<th colspan="2">GENERAL FEATURES</th>
</tr>
<tr>
<td>In Sales Package</td>
<td>Battery, Headset, Data Cable, Flipcover, Handset, Charger</td>
</tr>
<tr>
26
<td>Form</td>
<td>Bar</td>
</tr>
<tr>
<td>SIM</td>
<td>Dual SIM, GSM + GSM, (Dual Standby)</td>
</tr>
<tr>
<td>Touch Screen</td>
<td>Yes, Capacitive</td>
</tr>
<tr>
<td>Business Features</td>
<td>Document Viewer, Pushmail</td>
</tr>
<tr>
<td>Call Features</td>
<td>Conference Call, Speed Dialing, Hands Free, Loudspeaker, Call Divert</td>
</tr>
<tr>
<td>Handset Color</td>
<td>Elegant White</td>
</tr>
</table>
<br>
<table border=1 cellspacing="0">
<tr>
<th colspan="2">Platform</th>
</tr>
<tr>
<td>Operating Freq</td>
<td>GSM - 850, 900, 1800, 1900; UMTS - 2100</td>
</tr>
<tr>
<td>OS</td>
<td>Android v4.1 (Jelly Bean)</td>
</tr>
<tr>
<td>User Interface</td>
<td>TouchWiz 4.0</td>
</tr>
<tr>
<td>Java</td>
<td>Yes</td>
</tr>
<tr>
<td class="specs-key">Processor</td>
<td class="specs-value fk-data">1.2 GHz, Dual Core</td>
</tr>
</table>
<br>
<table border=1 cellspacing="0" class="fk-specs-type2">
27
<tr>
class="group-head" colspan="2">Display</th>
</tr>
<tr class="">
<td class="specs-key">Size</td>
<td class="specs-value fk-data">5 Inches</td>
</tr>
<tr class="">
<td class="specs-key">Resolution</td>
<td class="specs-value fk-data">WVGA, 480 x 800 Pixels</td>
</tr>
<tr class="">
<td class="specs-key">Color</td>
<td class="specs-value fk-data">16 M</td>
</tr>
<tr class="">
<td class="specs-key">Other Display Features</td>
<td class="specs-value fk-data">Multi-touch</td>
</tr>
</table>
<br>
<tr>
<th class="group-head" colspan="2">Camera</th>
</tr>
<tr class="">
<td class="specs-key">Primary Camera</td>
<td class="specs-value fk-data">Yes, 8 Megapixel</td>
</tr>
<tr class="">
<td class="specs-key">Secondary Camera</td>
<td class="specs-value fk-data">Yes, 2 Megapixel</td>
</tr>
<tr class="">
<td class="specs-key">Flash</td>
<td class="specs-value fk-data">LED</td>
</tr>
<tr class="">
<td class="specs-key">Video Recording</td>
<td class="specs-value fk-data">Yes, 1920 x 1080, 30 fps</td>
</tr>
<tr class="">
<td class="specs-key">HD Recording</td>
<td class="specs-value fk-data">HD, Full HD</td>
</tr>
<tr class="">
<td class="specs-key">Zoom</td>
<td class="specs-value fk-data">Digital Zoom - 4x</td>
</tr>
<tr class="">
<td class="specs-key">Other Camera Features</td>
<td class="specs-value fk-data">Auto Focus, Geo-tagging, Touch Focus, Face and
Smile Detection, Image Stabilization, Shot Mode (Single, Panorama, Smile Shot, HDR, Beauty,
28
Share shot, Buddy Photo Share), Image Editor</td>
</tr>
</table>
<br>
<tr>
<th class="group-head" colspan="2">Dimensions</th>
</tr>
<tr class="">
<td class="specs-key">Size</td>
<td class="specs-value fk-data">76.8x143.5x9.6 mm</td>
</tr>
<tr class="">
<td class="specs-key">Weight</td>
<td class="specs-value fk-data">161 g</td>
</tr>
</table>
<br>
<tr>
<th class="group-head" colspan="2">Battery</th>
</tr>
<tr class="">
<td class="specs-key">Type</td>
<td class="specs-value fk-data">Li-Ion, 2100 mAh</td>
</tr>
<tr class="">
<td class="specs-key">Talk Time</td>
<td class="specs-value fk-data">10 hrs (3G)</td>
</tr>
<tr class="">
<td class="specs-key">Standby Time</td>
<td class="specs-value fk-data">440 hrs (3G)</td>
</tr>
</table>
<br>
<tr>
<th class="group-head" colspan="2">Memory and Storage</th>
</tr>
<tr class="">
<td class="specs-key">Internal</td>
<td class="specs-value fk-data">8 GB</td>
</tr>
<tr class="">
<td class="specs-key">Expandable Memory</td>
<td class="specs-value fk-data">microSD, upto 64 GB</td>
</tr>
<tr class="">
<td class="specs-key">Memory</td>
<td class="specs-value fk-data">1 GB RAM</td>
</tr>
</table>
29
<br>
<tr>
<th class="group-head" colspan="2">Internet & Connectivity</th>
</tr>
<tr class="">
<td class="specs-key">Internet Features</td>
<td class="specs-value fk-data">Email</td>
</tr>
<tr class="">
<td class="specs-key">Preinstalled Browser</td>
<td class="specs-value fk-data">Android</td>
</tr>
<tr class="">
<td class="specs-key">GPRS</td>
<td class="specs-value fk-data">Yes</td>
</tr>
<tr class="">
<td class="specs-key">EDGE</td>
</tr>
<tr class="">
<td class="specs-key">3G</td>
<td class="specs-value fk-data">Yes, 21 Mbps HSDPA; 5.76 Mbps HSUPA</td>
</tr>
<tr class="">
<td class="specs-key">Wifi</td>
<td class="specs-value fk-data">Yes, 802.11 b/g/n</td>
</tr>
<tr class="">
<td class="specs-key">USB Connectivity</td>
<td class="specs-value fk-data">Yes, micro USB, v2</td>
</tr>
<tr class="">
<td class="specs-key">Tethering</td>
<td class="specs-value fk-data">Wi-fi Hotspot</td>
</tr>
<tr class="">
<td class="specs-key">Navigation Technology</td>
<td class="specs-value fk-data">A-GPS, GLONASS, with Google Maps</td>
</tr>
<tr class="">
<td class="specs-key">Bluetooth</td>
<td class="specs-value fk-data">Yes, v4, Supported Profiles (A2DP, AVRCP, OPP, SAP,
HID, PBAP, HFP, GAP, SPP, PBA)</td>
</tr>
<tr class="">
<td class="specs-key">Audio Jack</td>
<td class="specs-value fk-data">3.5 mm</td>
</tr>
</table>
<br>
30
<tr>
<th class="group-head" colspan="2">Multimedia</th>
</tr>
<tr class="">
<td class="specs-key">Music Player</td>
<td class="specs-value fk-data">Yes, Supports MP3, WAV, FLAC, eAAC+</td>
</tr>
<tr class="">
<td class="specs-key">Video Player</td>
<td class="specs-value fk-data">Yes, Supports H.263, WMV, H.264, MP4, Full
HD</td>
</tr>
<tr class="">
<td class="specs-key">FM</td>
</tr>
<tr class="">
<td class="specs-key">Ringtone</td>
<td class="specs-value fk-data">128 Polyphonic, MP3, WAV</td>
</tr>
</table>
<br>
<tr>
<th class="group-head" colspan="2">Other Features</th>
</tr>
<tr class="">
<td class="specs-key">SAR Value</td>
<td class="specs-value fk-data">0.316 W/Kg</td>
</tr>
<tr class="">
<td class="specs-key">Call Memory</td>
</tr>
<tr class="">
<td class="specs-key">SMS Memory</td>
</tr>
<tr class="">
<td class="specs-key">Phone Book Memory</td>
</tr>
<tr class="">
<td class="specs-key">Sensors</td>
<td class="specs-value fk-data">Proximity Sensor, Accelerometer, Compass, Gyro
Sensor</td>
</tr>
<tr class="">
<td class="specs-key">Additional Features</td>
<td class="specs-value fk-data">Predictive Text Input, Calendar, MMS Enabled, Mini
SIM, Clock, Calculator, Call Barring, Call Waiting, Offline Mode, Own Number Indication, Voice
Input</td>
</tr>
31
<tr class="">
<td class="specs-key">Important Apps</td>
<td class="specs-value fk-data">Google, Gmail, YouTube, Google Talk, Picasa, Instant
Messaging</td>
</tr>
</table>
<br>
<tr>
<th class="group-head" colspan="2">Warranty</th>
</tr>
<tr class="">
<td></td>
<td>1 year manufacturer warranty for Phone and 6 months warranty for in the box
accessories</td>
</tr>
</table>
</body>
</html>
EVALUATION:

Solution (3) (3)
Signature:
32
Practical-12
Aim: Create a webpage using frame, nested frame & inline frame.
<html>
<head>
<title>A frameset document</title>
</head>
<frameset cols="20%,60%,20%">
<frameset rows="*,200">
<frame src="contents_of_frame1.html">
<frame src="penguine.jpg">
</frameset>
<frame src="demo.html">
<frame src="contact.html">
</frameset>
</html>
EVALUATION:

Solution (3) (3)
Signature:
33
Practical-13
Aim: Create a simple calculator using the javascript function.
<html>
<head>
<title>Javascript - Calculator</title>
<script language=javascript type="text/javascript">
var plus, minus, divide, times
function initialise() {
plus = document.calc.operator.options[0]
minus = document.calc.operator.options[1]
divide = document.calc.operator.options[2]
times = document.calc.operator.options[3]
}
function calculate() {
x = parseInt(document.calc.val1.value)
y = parseInt(document.calc.val2.value)
if (plus.selected)
document.calc.answer.value = x + y
if (minus.selected)
document.calc.answer.value = x - y
if (divide.selected)
document.calc.answer.value = x / y
if (times.selected)
document.calc.answer.value = x * y
}
</script>
</head>
<body onLoad="initialise()">
<h2>Calculator</h2>
<form name="calc" action="post">
<input type=text name=val1 size=10>
<select name=operator>
<option value=plus>+
<option value=minus>-
<option value=divide>/
<option value=times>*
</select>
<input type=text name=val2 size=10>=<input type=text name=answer size=10>
<input type=button value=answer onClick="calculate()">
</form>
</body>
</html>
34
EVALUATION:

Solution (3) (3)
Signature:
35
Practical-14
Aim: Write a javascript function that executes all string functions. [charat(), indexof(),
valueof(),toLowerCase(), toUpperCase()]
<html>
<head>
<title>
String fun-js
</title>
<Script type="text/javascript">
document.write(' Test'.indexOf('T'));
document.write("<br />");
document.write('This is test'.charAt(10));
document.write('uppercase'.toUpperCase());
document.write(' Lower Case'.toLowerCase());
</script>
</table>
</body>
</html>
EVALUATION:

Solution (3) (3)
Signature:
36
Practical-15
Aim: Create a webpage of result analysis using javascript condition statement.
<html>
<head>
<title>result analysis</title>
<script type="text/javascript">
function getReuslt() {
var sub1 = document.getElementById("sub1").value;
var total = parseInt(sub1) + parseInt(sub2) + parseInt(sub3)
+ parseInt(sub4);
document.getElementById("total").value = total;
if (sub1 >= 23 && sub2 >= 23 && sub3 >= 23 && sub4 >= 23) {
alert("Your are pass");
}
else {
alert("Your are fail");
}
}
</script>
</head>
<body>
<table>
<tr>
<th>Enter your marks</th>
</tr>
<tr>
<td>Subject1: </td>
<td><input type=text name=s1 id="sub1"></td>
</tr>
<tr>
<td>Subject2: </td>
</tr>
<tr>
<td>Subject3: </td>
</tr>
<tr>
<td>Subject4: </td>
</tr>
<tr>
<td>total: </td>
<td><input type="text" id="total" disabled></td>
<td>
</tr>
<tr>
37
<td><input type="button" value="submit" onclick="getReuslt()" />
</td>
</tr>
</table>
</body>
</html>
EVALUATION:

Solution (3) (3)
Signature:
38
Practical-16
Aim: Create a simple calculator using javascript switch case.
<html>
<head>
<title>Switch case</title>
function calc() {
var opr = document.getElementById("opr").value;
var input1 = document.getElementById("t1").value;
var input2 = document.getElementById("t2").value;
var total = "";
switch (opr) {
case "*":
total = parseInt(input1) * parseInt(input2);

break;
case "+":
total = parseInt(input1) + parseInt(input2);

break;
case "-":
total = parseInt(input1) - parseInt(input2);

break;
case "/":
total = parseInt(input1) / parseInt(input2);

break;
}
}
</script>
</head>
<body>
<table>
<tr>
<td><input type="text" id="t1"></td>
<td><select name="opr" id="opr">
<option value="+"> +
<option value="-"> -
<option value="*"> *
<option value="/"> /
</select> </td>
<td><input type="text" id="t2"></td>
<td>=</td>
<td><input type="text" id="total" disabled></td>
39
<td><input type="button" value="Calculate" onclick="calc()"></td>
</table>
</body>
</html>
EVALUATION:

Solution (3) (3)
Signature:
40
Practical-17
Aim: Create a simple javascript array of 5 numbers and calculate the sum of each array
element using function.
<html>
<head>
function getTotal() {
let num = new Array();
num[0] = "10";
num[1] = "20";
num[2] = "30";
num[3] = "40";
num[4] = "50";
let array = "";

num.forEach((x,i) => array = array + (i == 0 ? "": ", " ) + x);
let total = parseInt(num[0]) + parseInt(num[1]) + parseInt(num[2]) + parseInt(num[3]) +

parseInt(num[4]);
document.getElementById("totalanswer").innerHTML = "<b>" + total + "</b>";

document.getElementById("displayArray").innerHTML = "<b> [" + array + "]</b>"
}
</script>
</head>
<body onload="getTotal()">
Array Elements : <div id="displayArray"></div>
Total Array is : <div id="totalanswer"></div>
</body>
</html>
EVALUATION:
Solution (3) (3)
Signature:
41
Practical-18
Aim: Create HTML document for registration & apply form validation using javascript.
<html>
<head>
<title>validation</title>
<script language="javascript">
function verify() {
if (document.form1.name.value == "") {
alert("Please give the name");
document.form1.name.forus();
return false;
}
if (document.form1.email.value == "") {
alert("Please give the email");
return false;
}
if (document.form1.age.value == "") {
alert("Please give age");
document.form1.age.focus();
return false;
}
if (document.form1.age.value < 18 || document.form1.age.value > 60) {
alert("Please give Age range between 18 and 60");
document.form1.age.focus();
return false;
}
if (document.form1.gender[0].checked == false &&
document.form1.gender[1].checked == false) {
alert("Please select gender");
document.form1.gender.focus();
return false;
}
if (document.for1.language1.checked == false &&
document.form1.language2.checked == false &&
document.form1.language3.checked == false) {
alert("Please Select your choice of language(Atleast One)");
return false;
}
if (document.form1.country.value == "") {
alert("Please give country");
document.form1.country.focus()
return false;
}
if (document.form1.myaddress.value == "") {
alert("Please give address");
document.form1.myaddress.focus();
return false;
}
if (document.form1.u_name.value == "") {
42
alert("Please give username");
document.form1.u_name.focus();
return false;
}
if (document.form1.pass.value == "") {
alert("Please give Password");
document.form1.pass.focus();
return false;
}
if (document.form1.pass.value.lenght < 6) {
alert("Please give a Password more than 5 characters");

document.form1.pass.focus();
return false;
}
if (document.form1.r_pass.value == "") {
alert("Please retype your password");
document.form1.r_pass.focus();
return false;
}
if ((document.form1.pass.value) != (document.form1.r_pass.value)) {
alert("Your password does not match");

document.form1.r_pass.value == "";
document.form1.r_pass.focus();
return false;
return (true);
}
</script>
</head>
<body>
<form method="POST" action="" name="form1">
<table border="2" align="center" cellpadding="7">
<tr>
<td><strong>Name:</strong></td>
<td><input type="text" name="name" /></td>
</tr>
<tr>
<td><strong>Email:</strong></td>
<td><input type="text" name="email" /> </td>
</tr>
<tr>
<td><strong>Age:</strong></td>
<td><input type="text" name="age" size="2" /></td>
43
</tr>
<tr>
<td><strong>Gender:</strong></td>
<td><input type="radio" name="gender" value="Male" />Male
<input type="radio" name="gender" value="Female" />Female
</td>
</tr>
<tr>
<td><strong>Language:</strong></td>
<td>
<input type="checkbox" name="language1" value="Hindi" />Hindi
<input type="checkbox" name="language2" value="English" />English
<input type="checkbox" name="language3" value="Urdu" />Urdu
</td>
</tr>
<tr>
<td><strong>Country:</strong></td>
<td>
<select name="country" />
<option value="" selected />
--Select--
<option value="indi" />
India
<option value="pakistan" />
Pakistan
<option value="beangladesh" />
Beangladesh
<option value="srilanka" />
Srilanka
</select>
</td>
</tr>
<tr>
<td><strong>Address:</strong></td>
<td>
<textarea rows="5" cols="20" name="myaddress" /></textarea>
</td>
</tr>
<tr>
<td><strong>Username:</strong></td>
<td>
<input type="text" name="u_name" />
</td>
</tr>
<tr>
<td><strong>Password:</strong></td>
<td>
<input type="password" name="pass" />
</td>
</tr>
<tr>
<td><strong>Retype Password:</strong></td>
44
<td>
<input type="password" name="r_pass" />
</td>
</tr>
<tr align="center">
<td>
<input type="submit" value="Submit" onClick="return (verify());" />
</td>
<td>
<input type="reset">
</td>
</tr>
</table>
</form>
</body>
</html>
EVALUATION:
Solution (3) (3)
Signature:
45

Practical 1

Uploaded by

Copyright:

Available Formats

You might also like

Practical 1

Uploaded by

Document Information

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Practical 1

Uploaded by

Copyright:

Available Formats

Practical-1

Problem Understanding Timely Mock (2) Total (10)

Problem Understanding Timely Mock (2) Total (10)

Problem Understanding Timely Mock (2) Total (10)

Problem Understanding Timely Mock (2) Total (10)

Problem Understanding Timely Mock (2) Total (10)

Problem Understanding Timely Mock (2) Total (10)

Problem Understanding Timely Mock (2) Total (10)

Problem Understanding Timely Mock (2) Total (10)

Problem Understanding Timely Mock (2) Total (10)

Problem Understanding Timely Mock (2) Total (10)

Problem Understanding Timely Mock (2) Total (10)

Problem Understanding Timely Mock (2) Total (10)

<table border=1 cellspacing="0">

Problem Understanding Timely Mock (2) Total (10)

Problem Understanding Timely Mock (2) Total (10)

Problem Understanding Timely Mock (2) Total (10)

Problem Understanding Timely Mock (2) Total (10)

Problem Understanding Timely Mock (2) Total (10)

total = parseInt(input1) * parseInt(input2);

total = parseInt(input1) + parseInt(input2);

total = parseInt(input1) - parseInt(input2);

total = parseInt(input1) / parseInt(input2);

Problem Understanding Timely Mock (2) Total (10)

let array = "";

let total = parseInt(num[0]) + parseInt(num[1]) + parseInt(num[2]) + parseInt(num[3]) +

document.getElementById("totalanswer").innerHTML = "<b>" + total + "</b>";

alert("Please give a Password more than 5 characters");

alert("Your password does not match");

<td><input type="text" name="name" /></td>

<input type="text" name="u_name" />

<input type="submit" value="Submit" onClick="return (verify());" />

You might also like