0% found this document useful (0 votes)
3 views16 pages

HTML Lab Source Code 2026

This is about designing webpage and the right person to to this works is a IT professional in server networking administration

Uploaded by

jadekaikapou16
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
3 views16 pages

HTML Lab Source Code 2026

This is about designing webpage and the right person to to this works is a IT professional in server networking administration

Uploaded by

jadekaikapou16
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd

HTML Lab Source Code

Activity No.1 [Link]


<HTML>
<HEAD>
<TITLE>HOME PAGE</TITLE>
<!-- Page created by Sujodh Shams on 28-Apr-2026 -->
</HEAD>
<BODY bgcolor="darkcyan">
<table border="1" width="80%" align="center">
<tr>
<td bgcolor="skyblue"><B>Page1</B></a></td>
<td><a href="[Link]">Page2</a></td>
<td><a href="[Link]">Page3</a></td>
<td><a href="[Link]">Page4</a></td>
<td><a href="[Link]">Page5</a></td>
</tr>
</table>
<!-- Here we discuss about bgcolor property, Heading, Paragraphs, Bold Italic Underline -->
<H1 align="center">MY FIRST WEBSITE</H1>
<P>This is my first paragraph</P>
<P>This is my second paragraph <BR>It is split into two lines</P>
<B>This text is bold</B> <BR>
<I>This text is italic</I> <BR>
<U>This text is underlined</U> <BR>
<B><I><U>This text is both bold, italic and underlined</U></I></B>

</BODY>
</HTML>
Activity No.2 [Link]
<HTML>
<HEAD>
<TITLE>PAGE 2</TITLE>
<!-- Page created by Sujodh Shams on 28-Apr-2026 -->
</HEAD>
<BODY bgcolor="darkorange">
<!-- Here we discuss about font Heading 1 to 6, hr tag, ol, ul, dl, anchor and image links -->
<table border="1" width="80%" align="center">
<tr>
<td><a href="[Link]"><img src="[Link]"/></a></td>
<td bgcolor="skyblue"><B>Page2</B></a></td>
<td><a href="[Link]">Page3</a></td>
<td><a href="[Link]">Page4</a></td>
<td><a href="[Link]">Page5</a></td>
</tr>
</table>
<BR><BR><BR><BR><BR><BR><BR>
<table border="1" width="80%" align="center">
<tr>
<td><a href="#section1">Section1</a></td>
<td><a href="#section2">Section2</a></td>
<td><a href="#section3">Section3</a></td>
<td><a href="#section4">Section4</a></td>
</tr>
</table>

<FONT face="Segoe UI" size="+2" color="#59FF5D">


<a name="section1">
<H1 align="center">MY SECOND WEBPAGE</H1>
<H2> This is the second page</H2>
<P>This is my first paragraph</P>
</a>
<BR><BR><BR><BR><BR><BR><BR>
<HR> <!-- horizontal rule -->

<a name="section2">
<H1>This is the largest heading, uses h1 tag</H1>
<H2>Heading Level 2</H2>
<H3>Heading Level 3</H3>
<H4>Heading Level 4</H4>
<H5>Heading Level 5</H5>
<H6>Heading Level 6</H6>

<BR><BR><BR><BR><BR><BR><BR>
<HR> <!-- horizontal rule -->
</a>

<a name="section3">
<UL>
<LI>List item 1</LI>
<LI>List item 2</LI>
<LI>List item 3</LI>
<LI>List item 4</LI>
<LI>List item 5</LI>
</UL>
</a>
<BR><BR><BR><BR><BR><BR><BR>
<HR> <!-- horizontal rule -->

<a name="section4">
<OL>
<LI>List item 1</LI>
<LI>List item 2</LI>
<LI>List item 3</LI>
<LI>List item 4</LI>
<LI>List item 5</LI>
</OL>
<BR><BR><BR><BR><BR><BR><BR>
<HR> <!-- horizontal rule -->
</a>
<DL>
<DT>HTML</DT>
<DD>Hyper Text Markup Language</DD>
<DT>JS</DT>
<DD>JavaScript</DD>
<DT>CSS</DT>
<DD>Cascading Style Sheets</DD>
</DL>
<HR> <!-- horizontal rule -->

<a href="[Link]
<img src="[Link]" height="10%" width="10%"/>
</a>

</FONT>
</BODY>
</HTML>
Activity No.3 [Link]
<HTML>
<HEAD>
<TITLE>PAGE 3</TITLE>
<!-- Page created by Sujodh Shams on 28-Apr-2026 -->
</HEAD>
<BODY background="[Link]">
<table border="1" width="80%" align="center">
<tr>
<td><a href="[Link]">Page1</a></td>
<td><a href="[Link]">Page2</a></td>
<td bgcolor="skyblue"><B>Page3</B></a></td>
<td><a href="[Link]">Page4</a></td>
<td><a href="[Link]">Page5</a></td>
</tr>
</table>
<!-- Here we discuss about adding a page background and also insert a picture -->
<P align="center">
<IMG src="[Link]" height="50%" width="50%" alt="lighter"/>
</P>
<BR><BR><BR>
</FONT>
</BODY>
</HTML>
Activity No.4 [Link]
<HTML>
<HEAD>
<TITLE>PAGE 4</TITLE>
</HEAD>
<BODY>
<!-- Here we discuss about tables, attributes, nesting tables -->
<table border="1" width="80%" align="center">
<tr>
<td><a href="[Link]">Page1</a></td>
<td><a href="[Link]">Page2</a></td>
<td><a href="[Link]">Page3</a></td>
<td bgcolor="skyblue"><B>Page4</B></a></td>
<td><a href="[Link]">Page5</a></td>
</tr>
</table>
<FONT face="Comic Sans MS" size="+1">
<TABLE border="1"> <!-- A table with 4 rows and 3 cols 4x3 table -->
<CAPTION>A table about cars</CAPTION>
<TR>
<TH>German Cars</TH>
<TH>Japanese Cars</TH>
<TH>Indian Cars</TH>
</TR>
<TR>
<TD>Audi</TD>
<TD>Honda</TD>
<TD>Mahindra</TD>
</TR>

<TR>
<TD>BMW</TD>
<TD>Toyota</TD>
<TD>Tata</TD>
</TR>

<TR>
<TD>Volvo</TD>
<TD>Mazda</TD>
<TD>Force</TD>
</TR>
</TABLE>

<BR><BR><BR><BR>
<TABLE align="center" border="2" cellpadding="10" cellspacing="10">
<TR>
<TD>Row 1 Column 1</TD>
<TD>Row 1 Column 2</TD>
</TR>
<TR>
<TD>Row 2 Column 1</TD>
<TD>Row 2 Column 2</TD>
</TR>
<TR>
<TD>Row 3 Column 1</TD>
<TD>Row 3 Column 2</TD>
</TR>
</TABLE>

<BR><BR><BR><BR>
<TABLE align="center" border="2" cellpadding="10"
cellspacing="10"
bgcolor="lime">
<TR>
<TH bgcolor="yellow" colspan="2">Table1 Row 1 Column 1</TH>
</TR>
<TR>
<TD>Table1 Row 2 Column 1</TD>
<TD>Table1 Row 2 Column 2</TD>
</TR>
<TR>
<TD>Table1 Row 3 Column 1</TD>
<TD>
<TABLE bgcolor="orange" border="1"> <!-- inner table -->
<TR>
<TD>Table2 Row 1 Column 1</TD>
<TD>Table2 Row 1 Column 2</TD>
</TR>

<TR>
<TD>Table2 Row 2 Column 1</TD>
<TD>Table2 Row 2 Column 2</TD>
</TR>

</TABLE>
</TD>
</TR>
</TABLE>
</FONT>
</BODY>
</HTML>
Activity No.5 [Link]
<html>
<body>
<table border="1" width="80%" align="center">
<tr>
<td><a href="[Link]">Page1</a></td>
<td><a href="[Link]">Page2</a></td>
<td><a href="[Link]">Page3</a></td>
<td><a href="[Link]">Page4</a></td>
<td bgcolor="skyblue"><B>Page5</B></a></td>
</tr>
</table>
<!-- Here we discuss about div, span, video -->
<font face="Segoe UI" size="+2">

<div style="background-color: lime; color:blue ;">


<p>This is some text in a div element.
<br>
This is split into two lines</p>
</div>
<p>My Mother have <span style="color: blue;">blue</span> eyes</p>

<video width="720" height="480" controls>


<source src="Video\HTML in 100 Seconds.mp4" type="video/mp4">
</video>

</font>
</body>
</html>
Activity No.6 [Link]
<html>
<head>
<title>Sample Frameset</title>
</head>

<!-- Here we discuss about frameset -->


<frameset rows="300,*" frameborder="2">
<frame name="topframe" src="[Link]" marginwidth="12" marginheight="12" scrolling="auto" resize>
<frame name="bottomframe" src="[Link]" marginwidth="12" marginheight="12" scrolling="auto"
resize>
</frameset>
</html>
Activity No.7 [Link]
<html>
<head>
<title>PAGE NAVIGATION</title>
</head>
<body>
<!-- Here we discuss about page navigation -->
<font face="Segoe UI" size="+2">

<table border="1" width="80%" align="center">


<tr>
<td><a href="[Link]">Page1</a></td>
<td><a href="[Link]">Page2</a></td>
<td><a href="[Link]">Page3</a></td>
<td><a href="[Link]">Page4</a></td>
<td><a href="[Link]">Page5</a></td>
</tr>
</table>

</font>
</body>
</html>
Activity No.8 [Link]
<html>
<head>
<title>Personal Information Page</title>
<!—A webpage about forms placed inside a table -->
</head>

<body bgcolor="silver">
<font face="Segoe UI" size="-1">
<h3><U>Personal Information</U></h3>
<fieldset>
<legend>Personal Information Form</legend>
<form>
<table border="1">
<tr>
<td align="right">Name</td>
<td><input type="text" size=30 maxlength=50 required/></td>
</tr>

<tr>
<td align="right">Username</td>
<td><input type="text" size=30 required/></td>
</tr>

<tr>
<td align="right">Password</td>
<td><input type="password" size=30 required/></td>
</tr>

<tr>
<td align="right">Confirm Password</td>
<td><input type="password" size=30 required/></td>
</tr>

<tr>
<td align="right">Email:</td>
<td><input type="email" size=30 required/></td>
</tr>

<tr>
<td align="right">Phone</td>
<td><input type="number" size=30 required/></td>
</tr>

<tr>
<td align="right">Gender</td>
<td>Male:<input type="radio" name="radio1" checked/>
Female:<input type="radio" name="radio1"/></td>
</tr>

<tr>
<td align="right">Are you above 18?</td>
<td>
<select>
<option>Select</option>
<option>Yes</option>
<option>No</option>
</select>
</td>
</tr>
<tr>
<td align="right">Tick your favourite sports</td>
<td>
Cricket:<input type="checkbox"></input> &nbsp;
Football:<input type="checkbox"></input> &nbsp;
Hockey:<input type="checkbox"></input> <br>
Basketball:<input type="checkbox"></input>
Tennis:<input type="checkbox"></input>
Baseball:<input type="checkbox"></input>
</td>
</tr>

<tr>
<td align="right">Comments</td>
<td><textarea rows="5" cols="32" required>
Enter your comments here
</textarea></td>
</tr>

<tr>
<td align="right"><input type="submit" value="Save" /></td>
<td><input type="reset" value="Clear"/></td>
</tr>

</table>
</form>
</fieldset>
</font>
</body>
</html>

You might also like