Part B – HTML
4. Write a HTML program for demonstrating Hyperlinks.
a. Navigation from one page to another.
b. Navigation within the page.
a. Navigation from one page to another.
Page1: Home page
<html>
<head>
<title>Home Page</title>
</head>
<body bgcolor="black">
<br> <br>
<center>
<font color="Orange" size="28"> HTML (Hypertext Markup Language) </font>
<br> <br>
<img src="C:\Users\hi\Pictures\Beautiful Images\[Link]" height="300"
width="500">
<h1 style="color:ffffff";> About HTML </h1>
<h2> <p Style="color:skyblue";>
HTML is a markup language that web browsers use to interpret and compose text,
images,
and other material into visible or audible web pages. Default characteristics for every
item of
HTML markup are defined in the browser, and these characteristics can be altered or
enhanced by the
web page designer's additional use of CSS. </p> </h2>
<h2 style="color:pink"> If U are Excited !! to know about Founder Just Click <a
href="[Link]">here</a></h2>
</center>
</body>
</html>
Chandana S, Asst Prof, GSSS-SSFGC, Mysore
Part B – HTML
Page2:About Page
<html>
<head
<title>About Page</title>
</head>
<body bgcolor="skyblue">
<center>
<font face=" Arial",color="red">
<h1> About TIM Berners-Lee </h1>
</font>
<img src="C:\Users\hi\Pictures\Beautiful Images\[Link]" height="300" width="300">
<h3><p>
The first version of HTML was written by Tim Berners-Lee in 1993. Since then,
there have been many different
versions of HTML. The most widely used version throughout the 2000's was
HTML 4.01,
which became an official standard in December 1999. Another version, XHTML,
was a rewrite of HTML as an XML language.
</p></h3>
<p>
Click <a href="[Link]">here</a> to go back to the HOME page.
</p>
</center>
</body>
</html>
Chandana S, Asst Prof, GSSS-SSFGC, Mysore
Part B – HTML
b. Navigation within the page.
<html>
<head>
<title>Hyperlink Demonstration</title>
</head>
<body>
<h2>Navigation Within the Page</h2>
<p>Click the link below to jump to the bottom of this page:</p>
<a href="#bottom">Go to Bottom of the Page</a>
<p style="margin-top: 500px;">This is some content to create space for
scrolling down.</p>
<h3 id="bottom">Bottom of the Page</h3>
<p>You have reached the bottom of the page.</p>
<p><a href="#top">Go back to Top</a></p>
</body>
</html>
Chandana S, Asst Prof, GSSS-SSFGC, Mysore
Part B – HTML
[Link] a HTML program for time-table using tables.
<html>
<head>
<title>Time Table</title>
</head>
<body>
<center>
<h1 style="color:GREEN"> TIME TABLE </h1>
<table border>
<tr style="color:red">
<th>Day/Period</th>
<th>I<br>9:00-10:00</th>
<th>II<br>10:00-11:00</th>
<th>11:00 - 11:10 </th>
<th>III<br>11:10-12:10</th>
<th>IV<br>12:10-1:10</th>
<th>1:10-1:40</th>
<th>V<br>1:40-2:40</th>
<th>VI<br>2:40-3:40</th>
Chandana S, Asst Prof, GSSS-SSFGC, Mysore
Part B – HTML
</tr>
<tr>
<td> <b> MONDAY </b> </td>
<td colspan="2">HTML/C++</td>
<td rowspan="6">BREAK</td>
<td> Maths </td>
<td> KAN</td>
<td rowspan="6">LUNCH</td>
<td> DCO </td>
<td> ENG</td>
</tr>
<tr>
<td> <b> TUESDAY </b> </td>
<td> Maths </td>
<td> C++ </td>
<td colspan="2"> R Prgm LAB</td>
<td colspan="2" > C++/Bizotic</td>
</tr>
<tr>
<td> <b> WEDNESDAY </b> </td>
<td colspan="2"> HTML/ R Progm </td>
<td> LIB </td>
<td > MATHS</td>
<td> KAN</td>
<td> ENG</td>
</tr><tr>
<td> <b> THURSDAY </b> </td>
<td> DCO </td>
<td> C++ </td>
<td> KAN</td>
<td> OE</td>
<td colspan="2"> HTML/Bizotic</td>
</tr>
<tr>
<td> <b> FRIDAY </b> </td>
<td colspan="2"> C++/ R Prgm</td>
<td> DCO </td>
Chandana S, Asst Prof, GSSS-SSFGC, Mysore
Part B – HTML
<td> ENG </td>
<td> CLUB </td>
<td> C++</td>
</tr>
<tr>
<td> <b> SATURDAY </b> </td>
<td> KAN </td>
<td> OE</td>
<td> ENG</td>
<td> NSS</td>
</table>
</center>
</body>
</html>
Chandana S, Asst Prof, GSSS-SSFGC, Mysore
Part B – HTML
[Link] a HTML program to develop a static Registration Form.
<html>
<head>
<title>Registration Page</title>
</head>
<body bgcolor="silver">
<br>
<br>
<h1> Registration Form</h1>
<form>
<label> Firstname: </label>
<input type="text" name="firstname"> <br> <br>
<label> Middlename: </label>
<input type="text" name="middlename"> <br> <br>
<label> Lastname: </label>
<input type="text" name="lastname"> <br> <br>
<label> Course: </label>
<select>
<option value="Course">Course</option>
<option value="BCA">BCA</option>
<option value="BBA">BBA</option>
<option value="BCom">BCom</option>
</select>
<br>
<br>
<label> Gender:</label> <br>
<input type="radio" name="male"/> Male <br>
<input type="radio" name="female"/> Female <br>
<input type="radio" name="other"/> Other
<br>
<br>
<label> Phone Number:</label>
<input type="text" name="country code" value="+91"> <br><br>
Address <br>
Chandana S, Asst Prof, GSSS-SSFGC, Mysore
Part B – HTML
<textarea cols="80" rows="5" value="Address">
</textarea>
<br> <br>
Email:
<input type="email" id="email" name="email"> <br>
<br> <br>
Password:
<input type="Password" id="pass" name="pass"> <br>
<br> <br>
Re-type password:
<input type="Password" id="repass" name="repass"> <br> <br>
<input type="button" value="Submit">
<input type="button" value="Reset">
</form>
</body>
</html>
Chandana S, Asst Prof, GSSS-SSFGC, Mysore