Scribd
Upload
167 views

It Programs

The document contains code examples for different HTML5 elements including headings, lists, tables, and links. It includes 14 programs demonstrating various HTML tags, attributes, and structures like ordered and unordered lists, tables with rows, columns, borders, and colors, nested lists, links, and calendars. The programs provide code snippets to display text formatting, headings, lists, tables, and links in HTML5.

Uploaded by

Isha Katiyar
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
167 views

It Programs

The document contains code examples for different HTML5 elements including headings, lists, tables, and links. It includes 14 programs demonstrating various HTML tags, attributes, and structures like ordered and unordered lists, tables with rows, columns, borders, and colors, nested lists, links, and calendars. The programs provide code snippets to display text formatting, headings, lists, tables, and links in HTML5.

Uploaded by

Isha Katiyar
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 40

IT Chp 3 HTML 5 Codes H077 (2) 19 March

1 PROGRAM -1 PHYSICAL TAGS:1

<! DOCTYPE html> <html><head> <title>Example of HTML5 text formatting tags</title> </head><body>
<b>This text is bold</b><br><br> <i>This text is italic</i><br><br> <mark>This text is
marked</mark><br><br> This is <sub>subscript</sub> and <sup>superscript </sup><br><br> <ins>This
text is inserted to the document</ins><br><br> <del>This text is deleted from the
document</del><br><br> </body> </html>

2 PROGRAM -2 HEADINGS:2

<! DOCTYPE html> <html> <head> <title>Heading levels</title> </head> <body bgcolor=”skyblue”>
<H1>Heading level 1 Text is largest in size</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 Text is smallest in size</H6>
</body></html>
3 PROGRAM -3 ORDER LIST:3

<! DOCTYPE html> <html><body> <h3>List of Topics</h3> <ol> <li>Basics of IT</li><li>HTML


5</li><li>PostgreSQL</li> </ol><h3>List of Topics start with series 50</h3> <ol start=”50”><li>Basics of
IT</li><li>HTML 5</li><li>PostgreSQL</li> </ol></body></html>

4 PROGRAMS – 4 ORDER LIST:4

<! DOCTYPE html><html><body> <h3>List of Topics in reverse sequence</h3> <ol reversed> <li>Basics
of IT</li><li>HTML 5</li><li>PostgreSQL</li></ol></body></html>

5 PROGRAM 5 UNORDERED LIST:5

<! DOCTYPE html> <html><head><title>Example of HTML Unordered List


</title></head><body><h3>HTML Unordered List</h3> <ul><li>Basics of IT</li><li>HTML 5</li>
<li>PostgreSQL</li></ul></body></html>
6 PROGRAM 6 SINGLE LEVEL NESTED LIST:6

<! DOCTYPE html> <html ><head><title>Example of HTML nested list</title>


</head><body><h3>HTML Nested List</h3> <ol> <li>Introduction to IT</li><li>Introduction to
DBMS</li> <ul type =” Circle”><li>Definition of DBMS</li> <li>applications of
DBMS</li><li>Advantages of DBMS</li> </ul><li>PostgreSQL</li></ol></body></html>

7 PROGRAM 7 MULTIPLE LEVEL N5ESTED LIST:7

<! DOCTYPE html><html ><head><title>nested list</title> </head><body><h3> Multi-level list


Nested List</h3><ul> <li>Daily computing</li> <li>Web design</li> <ol> <li>html
5</li><li>hyperlink</li><li>Inserting Images</li> </ol><li>Javascript</li><ul style=”list-style-type:
circle”> <li>conditional structure</li><ul style=”list-style-type: square”> <li>If statement</li> <li>If
else statement</li> <li>case statement</li> </ul> <li>loop statement</li></ul></ul></body></html>
8 TABLE PROGRAM:8

<!DOCTYPE html> <html> <head> <title>Table with 4 rows and 3 columns </title> </head> <body>
<table border=”2”> <tr><th>Sr. No.</th> <th>Input Device</th> <th>Output Device</th> </tr> <tr>
<td>1</td> <td>Keyboard</td> <td>Monitor</td> </tr> <tr> <td>2</td> <td>Mouse</td>
<td>Printer</td> </tr> <tr> <td>3</td> <td>Joystick</td> <td>Plotter</td> </tr> </table> </body>
</html>

9 TABLE PROGRAM 2 W/ CELLPADING:9

<!DOCTYPE html> <html><head> <title>Table with 4 rows and 3 columns </title> </head> <body>
<table border=”1” BORDERCOLOR=”GREEN” CELLSPACING =”20” CELLPADDING=”30”> <tr><th>Sr.
No.</th> <th>Input Device</th> <th>Output Device</th> </tr> <tr> <td>1</td> <td>Keyboard</td>
<td>Monitor</td> </tr> <tr> <td>2</td> <td>Mouse</td> <td>Printer</td> </tr> <tr> <td>3</td>
<td>Joystick</td> <td>Plotter</td> </tr> </table> </body> </html>
10 TABLE PROGRAM 3 W/ COLOURS 10

<!DOCTYPE html> <html> <head><title> Table with rowspan attribute </title></head> <body> <table
border=”3BORDERCOLOR=”GREEN” CELLSPACING =”20” CELLPADDING=”30”> <tr><td rowspan=2>
Colors </td> <td bgcolor=red>Red</td></tr><tr> <td bgcolor=green>Green</td></tr> </table>
</body> </html

11 ROWSPAN:11

<!DOCTYPE html> <html> <head><title> Table with rowspan attribute </title> </head> <body>
<table border=”5” BORDERCOLOR=”BLUE” CELLPADDING=”30”> <tr><td rowspan=”2”>Colors </td>
<td bgcolor=red>Red</td></tr><tr> <td bgcolor=green>Green</td></tr> </table> </body> </html>

12 COLSPAN:12

<!DOCTYPE html> <html> <head><title> Table </title></head> <body> <table border =”3”
BORDERCOLOR=”BLUE” CELLPADDING=”30”> <tr><td colspan=”2” align=”center”> Colors </td></tr>
<tr><td bgcolor=red>Red</td> <td bgcolor=green>Green</td> </tr> </table> </body></html>
13 A b c d in table1

<! DOCTYPE html> <html><head><title> 1 </title></head><body><table border=”1” height=”300”


width=”250”cellpadding=”20”><tr><td><center>a</center></td></tr><tr><td><center><pre>b
c</center></td></tr><tr><td><center><pre>d e f</center></td></tr><tr><td><center><pre>g h i
j</center></td></tr></table></body><html>

14 Calendar Program 1 (week)2

<! DOCTYPE html> <html><head><title>calendar Output</title><body text=”BLACK”><center><table


align=center width=250><tr><th><font color=”red”>Sun </font> <th>Mon <th>Tue <th>Wed
<th>Thu <th>Fri <th>Sat <tr><td>&nbsp; <td>&nbsp; <td>&nbsp; <td>1 <td>2 <td>3 <td>4 <tr><td
BGCOLOR=”ORANGE” style=color:purple>5 <td>6 <td>7 <td>8 <td>9 <td>10 <td>11</TD> <tr><td
BGCOLOR=”ORANGE”style=color:purple>12 <td>13 <td>14 <td>15 <td>16 <td>17 <td>18 </TD>
<tr><td BGCOLOR=”ORANGE” style=color:purple>19 <td>20 <td>21 <td>22 <td>23 <td>24 <td>25
<tr> <td BGCOLOR=”ORANGE”style=color:purple>26 <td>27 <td>28 <td>29 <td>30 <td>31
<td>&nbsp; </table></form></body></html>
15 Calendar Program 2 (month)3

<! DOCTYPE html> <HTML><HEAD><TITLE></TITLE></HEAD><BODY><TABLE WIDTH=40%> <TR


BGCOLOR=BLACK><TD ALIGN=CENTER COLSPAN=2><FONT
COLOR=WHITE><U>February</U></FONT><TD ALIGN=CENTER COLSPAN=3><FONT
COLOR=WHITE><B>March</B></FONT><TD ALIGN=CENTER COLSPAN=2><FONT
COLOR=WHITE><U>April</U></FONT></TR><TR ALIGN=CENTER BGCOLOR=YELLOW> <TD><FONT
COLOR=”RED”>Su</FONT><TD>Mo<TD>Tu<TD>We<TD>Th<TD>Fr<TD>Sa</TR><TR
ALIGN=CENTER> <TD><FONT COLOR=ORANGE><U>27</U></FONT><TD><FONT
COLOR=ORANGE><U>28</U></FONT><TD><FONT COLOR=ORANGE><U>29</U></FONT>
<TD><U>1</U><TD><U>2</U><TD><U>3</U><TD><U>4</U></TR><TR> <TD ALIGN=CENTER
BGCOLOR=ORANGE><U>5</U><TD><U>6</U><TD><U>7</U><TD><U>8</U><TD><U>9</
U><TD><U>10</U><TD><U>11</U></TR><TR> <TD ALIGN=CENTER
BGCOLOR=ORANGE><U>12</U></TD><TD><U>13</U><TD><U>14</U><TD><U>15</
U><TD><U>16</U><TD><U>17</U><TD><U>18</U></TR><TR> <TD ALIGN=CENTER
BGCOLOR=ORANGE><U>19</U><TD><U>20</U><TD><U>21</U>
<TD><U>22</U><TD><U>23</U><TD><U>24</U><TD><U>25</U></TR><TR> <TD ALIGN=CENTER
BGCOLOR=ORANGE><U>26</U></TD> <TD><U>27</U><TD><U>28</U><TD><U>29</U>
<TD><U>30</U><TD><U>31</U><TD><FONT
COLOR=ORANGE></FONT></TR></TABLE></BODY></HTML>

16 links browse by category


<! DOCTYPE html> <html><head><title>New Page</title></head><body><font color=”blue”
size=”+1”>Browse by Category</font> <table style=”border-top-style: solid; border-color:
green”><tr> <td><ul type=”square”><li> <a href=http://Microsoft.com> Windows</a></ul><td><ul
type=”square”><li> <a href=http://Office.htm > Office</a></ul><td><ul type=”square”><li> <a
href=http://develop.htm> Developers</a></ul><td><ul type=”square”><li><a
href=”it.html”>ITProfessionals</a></ul><td><ul type=”square”><li> <a
href=”business.htm”>Business Users</a></ul><td><ul type=”square”><li> <a
href=”home.htm”>Home Users</a></ul><tr><td><ul type=”square”><li> <a
href=”hardware.htm”>Hardware</a></ul><td><ul type=”square”><li> <a
Href=”games.htm”>Games and Xbox</a></ul><td><ul type=”square”><li> <a href=”trail.htm”>Trail
Software</a></ul><tr><td><ul type=”square”><li> <a href=”product.htm”>All
products</a></ul><td>&nbsp;<td>&nbsp;</table></body></html>

17 State Population yellow table 5

<! DOCTYPE html><html> <body> <center> <table bgcolor="yellow" WIDTH=”50%” BORDER=”1”


CELLPADDING=”2” CELLSPACING=”2”> <TR><TD>STATE</TD><TD>POPULATION</TD></TR>
<TR><TD>MAHARASHTRA</TD><TD><TABLE BORDER=”1”
CELLPADDING=”2”CELLSPACING=”1”><TR><TD>1981</TD><TD>---
</TD></TR><TR><TD>2001</TD><TD>---
</TD></TR></TABLE></TD></TR><TR><TD>KARNATAKA</TD><TD><TABLE BORDER=”1”
CELLPADDING=”2” CELLSPACING=”1”>
<TR><TD>1981</TD><TD>---</TD></TR><TR><TD>1991</TD><TD>---
</TD></TR><TR><TD>2001</TD><TD>---
</TD></TR><TABLE></TD></TR><TR><TD>KERLA</TD></TABLE></BODY></HTML>
18 links browse by category yellow bg color

<! DOCTYPE html> <html><head><title>New Page</title></head><body><font color=red size=+1>


</font><table BGCOLOR=yellow style=border-top-style: solid; border-color: green”><tr><TH>
Browse by Category</TH></TR> <TR><td><ul type=”square”><li> <a
href=http://Microsoft.com>Windows </a></ul><td><ul type=”square”><li> <a
href=http://Office.htm > Office</a></ul><td><ul type=”square”><li> <a
href=http://develop.htm>Developers </a></ul><td><ul

type=”square”><li><a href=”it.html”>ITProfessionals</a></ul><td><ul type=”square”><li> <a


href=”business.htm”>Business Users</a></ul><td><ul type=”square”><li> <a
href=”home.htm”>Home Users</a></ul><tr><td><ul type=”square”><li> <a
href=”hardware.htm”>Hardware</a></ul><td><ul type=”square”><li> <a
Href=”games.htm”>Games and Xbox</a></ul><td><ul type=”square”><li> <a href=”trail.htm”>Trail
Software</a></ul><tr><td><ul type=”square”><li> <a href=”product.htm”>All
products</a></ul><td>&nbsp;<td>&nbsp;</table></body></html>

19 Cricketers colorful (sir’s wrong one)

<!DOCTYPE html> <html><head><title>Table</title></head><body><table align=center


width=40%><tr align=center><td rowspan=2 bgcolor=blue width=100><h1>India
301/2</h1></td><td bgcolor=orange><font size=+2>Sachin 109*</font></td><tr align=center><td
bgcolor=orange><font size=+2>Kartik 53</font></td><tr align=center><td rowspan=2
bgcolor=blue><font size=+2>Over 38.2</font></td> <td bgcolor=green><font size=+2>Pak
320</font></td><tr align=center><td bgcolor=green><font size=+2>Akhtar 6.2 – 0 –
40</font></td><tr align=center><td colspan=2 bgcolor=blue><font size=+1>To win:2 run in 11.4
over</font></td></table></body></html> <br><br>

19 Cricketers colourful (assignment one) (CORRECT ONE)

<!DOCTYPE html> <html><head><title>Table</title></head><body><table bgcolor=pink


align=center width="40%"><tr align=center><td rowspan=2 bgcolor="lightgreen"
width=100><h1>India 301/2</h1></td><td bgcolor="aqua"><font size=+2>Sachin
109*</font></td><tr align=center><td bgcolor="aqua"><font size=+2>Kaif 53</font></td><tr
align=center><td rowspan=2 bgcolor="lightgreen"><font size=+2>Over 38.2</font></td> <td
bgcolor="orange"><font size=+2>Pak 320</font></td><tr align=center><td bgcolor="orange"><font
size=+2>Akhtar 6.2–0–40</font></td><tr align=center><td colspan=2 bgcolor="lightgreen"><font
size=+1>To win:2 run in 11.4 over</font></td></table></body></html> <br><br>

20 names of Cricketers 8 (sir’s wrong one)

<! DOCTYPE html> <HTML><HEAD><TITLE> TABLE </TITLE></HEAD><BODY> <TABLE BORDER=”0”


BGCOLOR=”ORANGE”> <TR><TD ALIGN =”LEFT”><OL TYPE=”1”><b> Names Of Cricketers </b>
</OL></TD></TR> <TD><UL><LI>SACHIN</LI><LI>DRAVID</LI><LI>DHONI</LI></UL></TR> <TR><TD
ALIGN =”LEFT”><OL TYPE=”1”><b> Names Of Writers </b> </OL></TD></TR> <TD><UL
type=”square”><LI>Shakeshpere</LI><Li>William wordsworth</LI><LI>Keats</LI></UL>
</TABLE></BODY></HTML>

20 names of Cricketers 8 (CORRECT ONE)

<! DOCTYPE html> <HTML><HEAD><TITLE> TABLE </TITLE></HEAD><BODY> <TABLE BORDER="0"


BGCOLOR="ORANGE"><TD ALIGN ="LEFT"><b>1. Names Of
Cricketers</b></TD></TR><TD><ul><LI>SACHIN</LI><LI>DRAVID</LI><LI>DHONI</LI></ul></
TR><TR><TD ALIGN ="left"><b>2. Names Of Writers</b></TD></TR><TD><UL
type="square"><LI>Shakeshpere</LI><Li>William
wordsworth</LI><LI>Keats</LI></TABLE></BODY></HTML>

21 Name of Cricketers in unordered list (sir ka wrong one)

<! DOCTYPE html> <HTML><HEAD><TITLE> TABLE </TITLE></HEAD> <BODY> <TABLE BORDER=”0”


BGCOLOR=”black”> <TR><TD ALIGN =”center”><OL><font color=”white”><h1><b><u> Unordered
List</u> </b></h1> </font> </uL></TD></TR> <TD><LI><UL type=”disc”><font
color=”white”><LI>Sachin Tendulkar</LI></font> <LI><font color=”white”><LI>Sourav
Ganguly</LI></font></LI> <LI><font color=”white”><LI>Virendra Shewag</LI>
</font></LI></UL></TR> <TR><TD></TR> <TD><LI><UL type=”disc”><font color=”white”><LI>Zaheer
Khan</LI></font> <LI><font color=”white”><LI>harbhagan Singh</LI></font></LI> <LI><font
color=”white”><LI>Anil Kumble</LI> </font></LI></UL></TR> <tr><td><a href =”file.html”>Click
here to goto previous page</a></td></tr> </TABLE></BODY></HTML>

21 Name of Cricketers in unordered list(CORRECT ONE ASSIGNMENT) (I am proud of mah self hehe)

<! DOCTYPE html> <HTML><HEAD><TITLE> TABLE </TITLE></HEAD><BODY>


<TABLE BORDER="0" BGCOLOR="BLACK" width=40%>
<TR><TD ALIGN ="left"><font color="white"><h1><b><u>Unordered List</u></b></h1></font>
</uL></TD></TR>
<TD><LI><UL type="disc"><font color="white"><LI>Sachin Tendulkar</LI></font>
<font color="white"><LI>Sourav Ganguly</LI></font></LI>
<font color="white"><LI>Virendra Shewag</LI> </font></LI></UL></TR>
<TR><TD></TR>
<TD><UL type="square"><font color="white"><LI>Zaheer Khan</LI></font>
<font color="white"><LI>Harbhagan Singh</LI></font></LI>
<font color="white"><LI>Anil Kumble</LI> </font></LI></UL></TR>
<tr><td><a href ="file.html">Click here to go to previous page</a></td></tr>
</TABLE></BODY></HTML>
22: 13th march timetable (sir ka wrong one)

<! DOCTYPE html> <HTML><HEAD><TITLE> TABLE </TITLE></HEAD><BODY> <TABLE BORDER=”2” >


<TR><TH colspan=”3”> 13<sup>TH</sup> MARCH 2008</TH></TR> <TR><TD BGCOLOR=YELLOW
ROWSPAN=”2”>9<SUB>A.M</SUB></TD> <TD BGCOLOR=”AQUA”> 15 </TD> <TD
BGCOLOR=”AQUA”>LAST MIN READ </TD></TR> <TR><TD BGCOLOR=pink> 30 </TD> <TD
BGCOLOR=pink> MOVE FROM HOUSE </TD></TR> <TR><TD BGCOLOR=YELLOW ROWSPAN=”2”>
10<SUB>A.M</SUB></TD> <TD COLSPAN=”1” BGCOLOR=”AQUA”> 20 </TD> <TD
BGCOLOR=”AQUA”> OUTSIDE LAB </TD> <tr><TD COLSPAN=”1” BGCOLOR=pink> 40 </TD> <TD
BGCOLOR=pink> REPORT FOR EXAM </TD></TR> </TABLE></BODY></HTML>

22: 13th march timetable (CORRECT ONE!)

<! DOCTYPE html> <HTML><HEAD><TITLE> TABLE </TITLE></HEAD><BODY> <TABLE BORDER="0" >


<TR><TH colspan="3" WIDTH=80%>13<sup>TH</sup> MARCH 2008</TH></TR> <TR><TD
BGCOLOR="YELLOW" ROWSPAN="2"><b>9<SUB>A.M</SUB><b/></TD> <TD BGCOLOR="AQUA"> 15
</TD> <TD BGCOLOR="AQUA">LAST MIN READ </TD></TR> <TR><TD BGCOLOR="RED"> 30 </TD>
<TD BGCOLOR="RED">READY TO GO</TD></TR> <TR><TD BGCOLOR="YELLOW" ROWSPAN="2"><B>
10<SUB>A.M</SUB></B></TD> <TD COLSPAN="1" BGCOLOR="CHOCOLATE"> 15 </TD> <TD
BGCOLOR="CHOCOLATE"> OUTSIDE LAB</TD> <tr><TD COLSPAN="1" BGCOLOR="LIGHTGREEN"> 30
</TD> <TD BGCOLOR="LIGHTGREEN">LOGIN</TD></TR> </TABLE></BODY></HTML>
23 Water science formulae aqua color (sir’s wrong one)

<! DOCTYPE html> <html><head><title> 5 </title></head><body> <table BGCOLOR=”AQUA”


BORDER=”1” align=”center” CELLPADDING =”20” width=”40%”> <TR><TD><p> 1001. (a+b)
<Sup>2</sup>=a<sup>2</sup>+b<sup>2</sup>+2ab </p> </TD></TR><br><br><br>
<TR><TD><p>&nbsp; &nbsp; &nbsp; 1002. This is my<sup>book</sup>
</p></TD></TR><br><br><br> <TR><TD><p>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
H<sub>2</sub>o=water</p></TD></TR><br><br><br> <TR><TD><p>&nbsp; &nbsp; &nbsp; &nbsp;
&nbsp;1004. C<sub>2</sub>H<sub>6</sub>=Ethane</p></TD></TR><br><br><br>
<TR><TD><p>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; This is
my<sub>Pen</sub></p></TD></TR></table> </body></html>

23 Water science formulae aqua color (CORRECT ONE)

<! DOCTYPE html>


<html><head><title>science formulae</title></head><body>
<table BGCOLOR="AQUA" BORDER="0" align="center" CELLPADDING ="20" width="35%">
<TR><TD><p> 1001. (a+b) <Sup>2</sup>=a<sup>2</sup>+b<sup>2</sup>+2ab </p>
</TD></TR><br><br><br><TR><TD><p>&nbsp; &nbsp; 1002. This is my<sup>book</sup>
</p></TD></TR><br><br><br>
<TR><TD><p>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;1003.
H<sub>2</sub>o=water</p></TD></TR><br><br><br>
<TR><TD><p>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;1004.
C<sub>2</sub>H<sub>6</sub>=Ethane</p></TD></TR><br><br><br>
<TR><TD><p>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; 1005. This is
my<sub>Pen</sub></p></TD></TR></table></body></html>

24 Place and numbers in YELLOW (CORRECT ONE)

<! DOCTYPE html> <HTML> <HEAD> <TITLE>TABLE EXAMPLE</TITLE> </HEAD>


<BODY bgcolor="yellow"><CENTER><TABLE bgcolor="yellow" WIDTH="10%" BORDER="1"
CELLPADDING="8" CELLSPACING="1" bordercolor="white"><TR><TD><font
color="red">place</font></TD><TD><font color="red">A</font></TD><td><font
color="red">B</font></td></TR><TR><TD><font color="red">Chennai</font></TD><TD><TABLE
BORDER="1" bordercolor="white" CELLPADDING="2"CELLSPACING="1"><TR><TD><font
color="red">1</font></TD><TD><font color="red">2</font></TD><td><font
color="red">3</font></td></TR><TR><TD><font color="red">4</font></TD><TD><font
color="red">5</font></TD><td><font color="red">6</font></td></TR><TR><TD><font
color="red">7</font></TD><TD><font color="red">8</font></TD><td><font
color="red">9</font></td></TR></TABLE></TD><td><font
color="red">C</font></td></TR><TR><TD><font color="red">mumbai</font></TD><TD><font
color="red">D</font></TD><td><font
color="red">E</font></td></TR></TABLE></CENTER></BODY></HTML>
25 superscript example

<! DOCTYPE html><html><head><title>superscript example</title></head><body><h1>X<sup>2</sup>


+ 4x + 4 = (X + 2)<sup>2</sup></h1></body></html>

26 subscript example

<! DOCTYPE html><html><head><title>subscript example</title></head><body><h1>N<sub>2</sub> +


H<sub>2</sub> => NH<sub>3</sub></h1></body></html>

27 Hyperlink example
<! DOCTYPE html><html><head><title>Hyperlink example</title></head><body><h1>Click the link <a
href="http://www.yahoo.com">www.yahoo.com</a></h1></body></html>

Sample of Table w/ me and my bff 


Assignment 2 of TABLES Codes Saturday
Program 1

<! DOCTYPE html> <HTML><HEAD><TITLE> TABLE </TITLE></HEAD><BODY> <TABLE BORDER="2"


CELLPADDING="10"><TR><TH colspan="3"> 13<sup>th</sup> MARCH 2013</TH></TR><TR><TD
ROWSPAN="2">9<SUB>A.M</SUB></TD><TD> 15 </TD><TD> LAST MIN READ </TD></TR><TR><TD> 45
</TD><TD> MOVE FROM HOUSE </TD></TR><TR><TD ROWSPAN="2"> 10<SUB>A.M</SUB></TD><TD
COLSPAN="1"> 20 </TD><TD> OUTSIDE LAB </TD></TR><tr><TD COLSPAN= "1"> 40 </TD><TD> REPORT
FOR EXAM </TD></TR></TABLE></BODY></HTML>

Program 2

<! DOCTYPE html> <html><head><title>calendar Output</title><body text="BLACK"><center><table


align="center” width="250"
bgcolor=teal><tr><th>Sun</th><th>Mon</th><th>Tue</th><th>Wed</th><th>Thu</th><th>Fri</
th><th>Sat</th></tr><tr><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>1</td><td>2</
td><td>3</td><td>4</td></tr><tr><td style=color: purple>5 <td>6</td> <td>7</td></td></td>
<td>8</td> <td>9</td> <td>10</td> <td>11</td> <tr><td style=color: purple>12 <td>13 </td> <td>14
</td> <td>15</td><td>16</td> <td>17</td> <td>18 </td> <tr><td style=color: purple>19 <td>20 </td>
<td>21</td> <td>22</td> <td>23</td> <td>24</td> <td>25</td> <tr><td style=color: purple>26
</td><td>27</td> <td>28</td> <td>29 </td><td>30 </td></td><td>31 </td> <td>&nbsp;
</table></form></body></html>

Program 3 (with white) (take out if black then)


<! DOCTYPE html> <HTML><HEAD><TITLE>SB TEXTILE</TITLE></HEAD><BODY><TABLE border="1"
cellpadding="10"><TR><TH align="left" bgColor="blue" colspan="4"><p style="color:white">SB
TEXTILES</p></TR><TR><TD Align="top" colspan="3">Name: ARJUN DIXIT <TD vAlign="top"
align="right" bgColor="pink">Order no. </TD><TR><TD vAlign="bottom" align="right"
colspan="3">Phone no.: 98765 43210 <TD vAlign="bottom" align="middle">1726 </TD><TR><TH>QTY
<TH>Particulars <TH>Rs. <TH>Ps. </TR><TR><TD align="right">1 <TD align="middle">Dress<TD
vAlign="top" align="middle">300 <TD align="middle">- - </TD><TR><TD align="right">2 <TD
align="middle">Saree<TD vAlign=top align="middle">200 <TD align="middle">50
</TD><TR><TD><BR><TD align="center">Total<TD align="right">500<TD align="middle">50
</TD></TR></TABLE></BODY></HTML>

Program 4

<! DOCTYPE html> <html><body><center><table border="5" cellpadding="10"><tr><th


rowspan="2">Sr.No</th><th rowspan="2">Name</th><th colspan="3">Mark</th><th
rowspan="2">Total</th></tr> <tr><td>Test 1</td><td>Test 2</td><td>Test
3</td></tr><tr><td>1</td><td>A</td><td>10</td><td>10</td><td>10</td><td>30</td></
tr><tr><td>2</td><td>B</td><td>20</td><td>20</td><td>20</td><td>60</td></tr><tr><td>3</
td><td>C</td><td>30</td ><td>30</td><td>30</td><td>90</td></tr></table></body></html>

Program 5 (width % change if needed and underlined words if needed)

<! DOCTYPE html> <HTML><HEAD><TITLE>TABLE WITH CAPTION</TITLE></HEAD>


<BODY><FONT SIZE=5>Celebrities in Collection:<BR><BR>
<TABLE WIDTH="50%" BORDER="10" CELLSPACING="1" CELLPADDING="4"></TR>
<TR><TH ALIGN="CENTER">Last Name<TH ALIGN="CENTER">First Name </th></tr>
<TR><TD><U>Smith</U><TD>John</TR><TD><U>Smithson</U></td>
<TD>Jane</TR><Tr><TD><U>Swedenborg</U><TD><u>Emmanuel<u></TR></TABLE></BODY></HTML>

Program 6 (change width % if needed) (width=”60%”) (colour can change)

<! DOCTYPE html> <html><head><title>table test</title></head>

<body text="black" title="good morning"><table border="5"><u><tr>

<th rowspan="2">Model Name<th rowspan="2">Power Supply<th colspan="2">

<u>Power Consumed</u></tr><tr><td><u>Cooking </u><td><u> Warming</u></tr>

<tr><td ><u>Smart</u><td>230 vac<td>450W<td>45W</tr></table></body></html>

Program 7 (underline words if needed)(change width % if needed)(width=”60%”)

<! DOCTYPE html> <HTML><HEAD><TITLE>TABLE</TITLE></HEAD><BODY>

<TABLE BORDER="5" CELLSPACING="2" CELLPADDING="3"><TR BGCOLOR="BLUE">

<TH ALIGN="CENTER" HEIGHT="20"><FONT SIZE="4" COLOR="WHITE">First Name

<TH ALIGN="CENTER" HEIGHT="20"><FONT SIZE="4" COLOR="WHITE">Last Name

</TR><TR BGCOLOR="YELLOW"><TD>Keith<TD>Richards</TR><TR BGCOLOR="ORANGE">

<TD>Mick<TD>Jagger</TR><TR BGCOLOR="YELLOW"><TD>Bill<TD>Wyman

</TR><TR BGCOLOR="ORANGE"><TD>Ron<TD>Wood</TR><TR BGCOLOR="YELLOW">


<TD>Charlie<TD>Watts</TR><TR BGCOLOR="ORANGE"><TD>Mick<TD>Taylor</TR>

<TR BGCOLOR="YELLOW"><TD>Brian<TD>Jones</TR></TABLE></BODY></HTML>

Program 8 (underline words if needed) (<u>)

<! DOCTYPE html> <HTML><HEAD><TITLE>Assignment 1.5</TITLE></HEAD><BODY><TABLE


CELLSPACING="1" CELLPADDING="7" BORDER="1"><TD> <TABLE CELLSPACING="1" CELLPADDING="7"
BORDER="1"><CAPTION>CSS3 Browser Support (latest browser version) <TR><TH>CSS
Property</TH><TH>Internet Explorer</TH> <TH>Firefox</TH><TH>Chrome</TH>
<TH>Safari</TH><TH>Opera</TH></TR> <TR><TD>Border Radius</TD> <TD
ALIGN="CENTER">YES</TD><TD ALIGN="CENTER">YES</TD> <TD ALIGN="CENTER">YES</TD><TD
ALIGN="CENTER">YES</TD> <TD ALIGN="CENTER">YES</TR><TR><TD>Box Shadow</TD><TD
ALIGN="CENTER">YES<TD ALIGN="CENTER">YES<TD ALIGN="CENTER">YES</TD><TD
ALIGN="CENTER">YES<TD ALIGN="CENTER">YES</TR><TR><TD>CSS Animations</TD><TD
ALIGN="CENTER">NO</TD><TD ALIGN="CENTER">NO<TD ALIGN="CENTER">YES</TD><TD
ALIGN="CENTER">YES</TD><TD
ALIGN="CENTER">NO</TD></TR></TABLE></TD></TABLE></BODY></HTML>

Program 9 (underline words if needed) (<u>)

<! DOCTYPE html> <HTML><HEAD><TITLE>TABLE</TITLE></HEAD><BODY><CENTER><TABLE


BGCOLOR="PINK" BORDER=1 BORDERCOLOR="BLACK"
CELLPADDING="10"CELLSPACING="0"><TR><TH><B>Name</B>
<TH><B>Year</B><TH><B>Country</B></TR><TR><TD>purush<TD>1988<TD>India</
TR><TR><TD>Dave<TD>1988<TD>United States</TR><TR><TD>Jane<TD> 1989<TD>Canada</TR>
<TR><TD>Matthew<TD>
1999<TD>Japan</TR><TR><TD>Jane<TD>1989<TD>Canada</TR></CENTER></TABLE></BODY></HTML>

Program 10 (underline words if needed) (<u>)

<! DOCTYPE html><HTML><HEAD><TITLE> NESTED TABLE </TITLE></HEAD> <BODY><CENTER><TABLE


BGCOLOR="YELLOW" WIDTH="50%" BORDER="1"CELLPADDING="2"CELLSPACING="2">
<TR><TH>STATE</TH><TH>POPULATION</TH></TR><TR><TD><B>MAHARASHTRA
</B></TD><TD><TABLE BORDER="1" CELLPADDING="2"CELLSPACING="1"><TR><TD>1981</TD><TD>---
</TD></TR><TR><TD>2001</TD><TD>---</TD></TR></TABLE></TD></TR><TR><TD><B>KARNATAKA</
B></TD><TD><TABLE BORDER="1"CELLPADDING="2"CELLSPACING="1"> <TR><TD>1981</TD><TD>---
</TD></TR><TR><TD>1991</TD><TD>---</TD></TR><TR><TD>2001</TD><TD>-- </TD></TR><TABLE>
</TD></TR><TR><TD><B>KERALA</B></TD></TABLE></BODY></HTML>

Different OL Types
Type Description
type="1" The list items will be numbered with
numbers (default)
type="A" The list items will be numbered with
uppercase letters
type="a" The list items will be numbered with
lowercase letters
type="I" The list items will be numbered with
uppercase roman numbers
type="i" The list items will be numbered with
lowercase roman numbers

FORMS PROGRAM 1

<!DOCTYPE HTML>
<HTML>
<head><title>Form with Input elements</title></head>
<body bgcolor="orange">
<h1>Use of form for personal information</h1>
<form method ="post" action ="Thankyou.html">
Enter your Name :<input type="text" Name="n1" maxlength="20"><Br><br>
Enter your Email address : <input type="text" Name="n2" maxlength="20"><Br><br>
Enter your Address : <Textarea name="TA1" rows="" cols=""> </Textarea><br><br>
Select your Country : <select>
<option value ="1"> India </Option>
<option value ="2"> USA </Option>
<option value ="3"> Uk </Option>
</Select><br><br>
Select your City : <select multiple size ="2">
<option value ="1"> Mumbai</Option>
<option value ="2"> Delhi</Option>
<option value ="3"> Goa</Option>
</Select><br><br>
Enter your standard : <input type ="radio" name="rb1" value="11">
11<sup>th</sup> <input type="radio" name="rb1" value="12">12<sup>th
</sup><br><br>
Choose your optional subjects : <br><br>
<input type="checkbox" name="c1" Value="Hindi">Hindi<br>
<input type="checkbox" name="c2" Value="German">German<br>
<input type="checkbox" name="c3" Value="Biology">Biology<br>
<input type="checkbox" name="c4" Value="IT">IT<br>
<input type="submit" value="Submit">
<input type ="Reset" value="Reset"><br>
</form></body></HTML>
FORMS PROGRAM 2
<!DOCTYPE html>
<html>
<head><title> Form elements and textarea </title></head>
<body bgcolor="cyan" text ="Red">
<h1> Use of form elements </h1>
<form method = "post" action = "data.php">
Enter your name: <input type = "text" name = "fn"> <br> Select your city :
<select name=''ct''>
<option>Pune</option>
<option>Nagpur</option>
<option>Solapur</option>
</select><br>
Enter your address: <textarea name = "address" rows = "3" cols = "30" placeholder = "your address"
required> </textarea> <br>
<input type = "submit" value = "send">
</form></body> </html>
Note : PHP is server side scripting language.In the above program 'data.php' is the name of PHP file
which stores the accepted data (from tb)

FORMS PROGRAM 3 (program 1 with reset button)


<!DOCTYPE html>
<html>
<head><title> Form elements and textarea </title></head>
<body bgcolor = "cyan" text ="Red">
<h1> Use of form elements </h1>
<form method = "post" action = "data.php">
Enter your name: <input type = "text" name = "fn"> <br>
Select your city :
<select name="ct">
<option>Pune</option>
<option>Nagpur</option>
<option>Solapur</option>
</select><br>
Enter your address: <textarea name = "address" rows = "3" cols = "30" placeholder = "your address"
required> </textarea><br>
<input type = "submit" value = "send">
<input type ="Reset" value= "Reset">
</form></body> </html>

FORMS PROGRAM 4 -1
<!DOCTYTPE HTML><html><head><title>Program 1</title></head>
<body bgcolor="yellow"><h1 align="center"><u>REGISTRATION FORM</u></h1><br><br><form
align="center" method ="post" action ="thankyou.html">
NAME:<input type="text"name="tb1" placeholder="YOUR NAME"required><br><br>
GENDER: <input type="radio" name="rb1" value="Male" checked>MALE
<input type="radio" name="rb1" value="Female">FEMALE<br><br>
ADDRESS: <textarea cols="0" rows="0" placeholder="YOUR ADDRESS"required></textarea><br><br>
CITY: <select name="city" multiple size="3"> <option>MUMBAI</option>
<option>PUNE</option> <option>NAGPUR</option>
<option>AURANGABAD</option> <option>KOLHAPUR</option></select> <br><br>YOUR FIELD OF
INTEREST:<br>
<input type="checkbox"name="c1"value="READING"required> READING <br>
<input type="checkbox"name="c2"value="PAINTING"required>
PAINTING<br>
<input type="checkbox"name="c3"value="SINGING"required>
SINGING <br>
<input type="checkbox"name="c4"value="DANCING"required>
DANCING <br>
<input type="checkbox"name="c5"value="SPORTS"required>
SPORTS <br><br>
<input type="submit"name="s1"value="SUBMIT">
<input type="reset"name="rs1"value="RESET">
</form></body></html>

FORMS PROGRAM 5 a (Thursday-15th April)-2


<!DOCTYPE HTML><html><head><title>PROGRAM 2</title></head>
<body align="center" bgcolor="orange"><h1><u><i>FEEDBACK FORM</i></u></h1><form
method="post"><table align="center"><tr align="left"><td>NAME:</td><td><input
type="text"name="t1"placeholder="YOUR NAME"required></td></tr>
<tr align="left"><td>ADDRESS:</td><td><textarea name="ta1" rows="5" cols="30"placeholder="YOUR
ADDRESS"required></textarea></td></tr><tr align="left"><td>CITY:</td><td><input
type="text"name="C1"placeholder="ENTER YOUR CITY"required></td></tr><tr align="left"><td>ZIP
CODE:</td><td><input type="text"name="t2"maxlength="6"placeholder="xxxxxx"required>
</td></tr><tr align="left"><td>EMAIL ID:</td><td><input
type="email"name="email"placeholder="YOUR EMAIL ADDRESS"required autocomplete></td></tr>
<tr align="left"><td>COMMENT:</td><td><textarea name="comment" rows="5"
cols="30"placeholder="YOUR COMMENT"required></textarea></td></tr>
<tr align="left"><td><input type="submit"name="s1"value="SUBMIT"></td>
<td><input type="reset"name="r1"value="RESET"></td></tr>
</table></form></body></html>

FORMS PROGRAM 5 b (with D.O.B) (with Time Joining)


<!DOCTYPE HTML><html><head><title>PROGRAM 2</title></head>
<body align="center" bgcolor="orange"><h1><u><i>FEEDBACK FORM</i></u></h1>
<form method="post"><table align="center">
<tr align="left"><td>NAME:</td><td><input type="text"name="t1" placeholder="YOUR
NAME"required></td></tr>
<tr align="left"><td>ADDRESS:</td><td><textarea name="ta1" rows="5" cols="30"placeholder="YOUR
ADDRESS"required></textarea></td></tr>
<tr align="left"><td>CITY:</td><td><input type="text"name="C1" placeholder="ENTER YOUR
CITY"required></td></tr><tr align="left"><td>ZIP CODE:</td><td><input
type="text"name="t2"maxlength="6"placeholder="xxxxxx"required>
</td></tr><tr align="left"><td>EMAIL ID:</td><td><input
type="email"name="email"placeholder="YOUR EMAIL ADDRESS"required autocomplete></td></tr>
<tr align="left"><td>Time of Joining:</td><td><Input type="Datetime-local"></td></tr>
<tr align="left"><td>DOB:</td><td><Input type="Date"></td></tr>
<tr align="left"><td>COMMENT:</td><td><textarea name="comment" rows="5"
cols="30"placeholder="YOUR COMMENT"required></textarea></td></tr>
<tr align="left"><td><input type="submit"name="s1"value="SUBMIT"></td>
<td><input type="reset"name="r1"value="RESET"></td></tr>
</table></form></body></html>
FORMS PROGRAM 6 -3
<!DOCTYPE HTML><html><head><title>Program 3</title></head>
<body align="center" bgcolor="red">
<h1><u><i><b>INDIAN CRICKETERS</b></i></u></h1><br><br><br>
<form method="post"name="form">
CHOOSE YOUR FAVOURTIE CRICKETER:-
<select name="s1"multiple size="2">
<option value="1">SACHIN TENDULKAR</option>
<option value="2">RAHUL DRAVID</option>
<option value="3" selected>MS DHONI</option>
<option value="4">KAPIL DEV</option>
<option value="5" selected>VIRAT KOHLI</option>
</select><br><br>
<input type="submit"name="su1"value="SUBMIT">
<input type="reset"name="r1"value="RESET">
</form></body></HTML>
FORMS PROGRAM 7 -4
<!DOCTYPE HTML>
<html><head><title>Practical 4</title></head>
<body align="center"bgcolor="pink">
<h1><u>PERSONAL INFORMATION</u></h1>
<form method="POST"name="form">
NAME:-<input type="text"name="n1"placeholder="YOUR FULL NAME"required><br><br>
AGE:-<input type="number"min="18"max="100"required><br><br>
ADDRESS:-<textarea name="ta1" rows="5" cols="30"placeholder="YOUR
ADDRESS"required></textarea><br><br>
STATUS:-<input type="radio"name="r1"value="Working">WORKING
<input type="radio"name="r1"value="Non-Working">NON-WORKING <br><br>
QUALIFICATION:-<select name="s1"required>
<option>XTH</option>
<option>XIITH</option>
<option>GRADUATE</option>
<option>POSTGRADUATE</option>
</select><br><br><input type="submit"name="su1"value="SUBMIT">
<input type="reset"name="re1"value="RESET"></form></body></HTML>
FORMS PROGRAM 8 -5 (no need of placeholder for joining date)
<!DOCTYPE HTML><html><head><title>Prpgram 5</title>
<body align="LEFT" bgcolor="Skyblue"><h1><b><i>EMPLOYEE LOG IN</i></b></h1>
<form method="POST">NAME: <input type="text"name="t1"placeholder="ENTER YOUR
NAME"required><br><br>DATE OF JOINING:<input type="date"placeholder="DD/MM/YYYY"
required><br><br>DEPARTMENT:<select name="s1"><option>HR</option>
<option>SALES</option><option>MARKETING</option></select><br><br>
<input type="submit"name="su1"value="SUBMIT">
<input type="reset"name="re1"value="CLEAR"></form></body></HTML>

FORMS PROGRAM 9 -6
<!DOCTYPE HTML> <HTML><head><title>PROGRAM 6</title>
</head><body bgcolor="lavender"align="left"><h1><b><u>GENERAL
INFORMATION</u></b></h1><br><br><form name="f1" method="POST" action="Thank
You.html">NAME OF THE STUDENT:-<input type="text"name="t1"placeholder="FULL
NAME"required><br><br>ADDRESS:-<textarea name="ta1"rows="5"cols="30"placeholder="YOUR
ADDRESS"required></textarea><br><br>

CITY:-<input type="text"name="c1"placeholder="YOUR CITY"required><br><br>

PINCODE:-<input type="text"name="n1"placeholder="xxxxxx"maxlength="6"required>

<br><br>GENDER:-<input type="radio"name="r1"value="male">MALE

<input type="radio"name="r1"value="female">FEMALE<br><br>

HOBBIES:-<br>

<input type="checkbox"name="ch1"value="reading">READING<br>

<input type="checkbox"name="ch2"value="singing">SINGING<br>

<input type="checkbox"name="ch1"value="dancing">DANCING<br>

<input type="checkbox"name="ch1"value="painting">PAINTING<br>

<input type="checkbox"name="ch1"value="sports">SPORTS<br><br>

<input type="submit"name="su1"value="SUBMIT">

<input type="reset"name="re1"value="RESET">

</form></body></html>
FORMS PROGRAM 10 -7
<!DOCTYPE HTML><html><head><title>Program 7</title></head>
<body bgcolor="Teal"align="center"><br><h1><u><i>REGISTRATION FORM</i></u></h1><br>
<form name="form"method="POST" action="Thankyou.html">
USERNAME:-<input type="text"name="t1"placeholder="ENTER YOUR NAME"required><br><br>
GENDER:-<input type="radio"name="r1"value="male">MALE
<input type="radio"name="r1"value="female">FEMALE<br><br>
ADDRESS:-<textarea name="ta1"row"6"cols="20"placeholder="YOUR ADDRESS"required>
</textarea><br><br
>HOBBIES:-<select name="s1">
<option>Singing</option>
<option>Dancing</option>
<option>Biking</option>
</select><br><br>
<input type="submit"name="su1"value="SUBMIT">
<input type="reset"name="re1"value="RESET">
</form></body></HTML>
FORMS PROGRAM 11 -8
<!DOCTYPE HTML><html><head><title>Program 8</title></head>
<body align="center"bgcolor="Turquoise"><br><br>
<h1><u>FAMOUS CRICKETERS</u></h1><br><br><br>
<form method="POST">YOUR NAME:<input
type="text"name="t1"placeholder="NAME"required><br><br>
WHO IS YOUR FAVOURIE CRICKETER?
<select name="s1"><option>STEVE SMITH</option><option>VIRAT KOHLI</option>
<option>KANE WILLIAMSON</option><option>DAVID WARNER</option>
<option>BEN STOKES</option></select><br><br><input type="submit"name="su1"value="SUBMIT">
<input type="reset"name="re1"value="RESET">
</form></body></HTML>
FORMS PROGRAM 12 -9
<!DOCTYPE HTML><html><head><title>Program 9</title></head>
<body bgcolor="lavender" align="left">
<h1><u>REGISTRATION FORM</u></h1><br><br>
<form method="POST">USERNAME:<input type="text"name="t1"placeholder="YOUR
NAME"required><br><br>GENDER:<input type="radio"name="r1"value="male">MALE
<input type="radio"name="r1"value="female">FEMALE
<br><br>AGE:<input type="number"placeholder="YOUR AGE"required><br><br>
HOBBIES:<br><input type="checkbox"name="c1"
value="singing">SINGING<br><input type="checkbox"name="c2"
value="dancing">DANCING<br><input type="checkbox"name="c3"
value="reading">READING<br><input type="checkbox"name="c4"
value="swimming">SWIMMING<br><input type="checkbox"name="c5"
value="biking">BIKING<br><br><input type="submit"name="su1"value="SUBMIT">
<input type="reset"name="re1"value="RESET"></form></body></html>

FORMS PROGRAM 13 -10


<!DOCTYPE HTML>
<html><head><title>Program 13</title></head>
<body bgcolor="Gold"align="left">
<h1><u><i><b>HOTEL ROYAL</b></i></u></h1>
<ul style"list-style-type: square">
<li>VEG ITEMS</li><ol>
<li>Malai Kofta</li>
<li>Veg Pizza</li>
<li>Paalak Paneer</li>
</ol><br><li>NON-VEG ITEMS</li>
<ol><li>Chicken Burger</li>
<li>Tandoori Lamb Chops</li>
<li>Curried Parmesan Fish Fingers</li>
</ol></ul></body></html>

FORMS PROGRAM 14 -11


<!DOCTYPE HTML><html><head><title>Program 14</title></head>
<body align="left"bgcolor="Tan"><h1><u><b>Hotel Royal</b></u></h1>
<form name="form"method="POST">VEG:-<br><input type="checkbox"name="c1"value="Pasta">
PASTA<br><input type="checkbox"name="c2"value="Falafel">
FALAFEL<br><input type="checkbox"name="c3"value="Burritos">BURRITOS<br><input
type="checkbox"name="c4"value="Guacamole">
GUACAMOLE<br><input type="checkbox"name="c5"value="Spring Rolls">SPRING ROLLS<br><br>
NON-VEG:-<br><input type="checkbox"name="ch1"value="chicken">
GRILLED CHICKEN ESCALOPE WITH FRESH SALSA<br>
<input type="checkbox"name="ch2"value="mutton">MUTTON KORMA<br><input
type="checkbox"name="ch3"value=
"pork ribs">PINA COLADA PORK RIBS<br><input type="checkbox"name="ch4"value="fish">
MALABAR FISH BIRYANI<br><input type="checkbox"name="ch5"value="prawn">GOAN PRAWN CURRY
WITH RAW MANGO<br><br><input type="submit"name="su1"value="ORDER">
</form></body></html>
FORMS PROGRAM 15 -12
<!DOCTYPE HTML><html><head><title>Program 15</title>

</head><body align="left"bgcolor="Grey">
<h1>SELECT YOUR FAVORITE SUBJECT</h1><br>
<input type="checkbox"name="c1"value="IT">Information Technology<br>
<input type="radio"name="rb1"value="Maths">Maths<br>
<input type="checkbox"name="c3"value="Accounts">Book-Keeping And Accountancy<br>
<input type="checkbox"name="c4"value="Eco">Economics<br>
<input type="checkbox"name="c6"value="OCM">Organisation of Commerce and Management<br>
<input type="checkbox"name="c7"value="Eng">English
<br>
<input type="radio"name="rb1"value="SP">SP<br><br>
<input type="submit"name="su1"value="SUBMIT">
<input type="reset"name="re1"value="RESET">
</form></body></HTML>
FORMS PROGRAM 16 -13
<!DOCTYPE HTML><html><head><title>Program 17</title></head>
<body bgcolor="aqua" align="left"><h1><b>STUDENT LOG IN</b></h1><br><br>
<form name="form"method="POST">
Student Name:<input type="text"name="t1"placeholder="YOUR FULL NAME"required><br><br>
Date of Admission:<input type="date"placeholder="DD/MM/YYYY"required><br><br>
Course:<select><option>BBA</option><option>BCA</option>
<option>BBM</option></select><br><br>
<input type="submit"name="su1"value="SUBMIT">
<input type="reset"name="re1"value="RESET">
</form></body></html>
FORMS PROGRAM 16 -13
<!DOCTYPE HTML><html><head><title>Program 18</title></head>
<body bgcolor="Lightgreen" align="center"><form method="POST">
<h1><b>FORM</b></h1><br><br>NAME:<input type="text"name="t1"placeholder="YOUR
NAME"required><br><br>DATE:<input type="date"name="date"required><br><br>
TIME:<input type="time"name="time"required><br><br>
<input type="submit"name="su1"value="SUBMIT"><input type="reset"name="re1"value="RESET">
</form></body></html>

FORMS PROGRAM 17 -14


<!DOCTYPE HTML><html><head><title>Program 19</title></head>
<body bgcolor="Gold"align="center"><h1><u>OFFICE FORM</u></h1><br><br><br>
<form method="POST">NAME:<input type="text"name="t1"placeholder="FULL NAME"required
autocomplete><br><br>EMAIL ADDRESS:<input typ="email"name="email" placeholder="YOUR EMAIL
ID" autocomplete required><br><br>
NUMBER OF YEARS COMPLETED IN OFFICE:<input type="number"min="2"required><br><br>
OFFICE PHONE NUMBER:<input type="tel"pattern="{0-9}[2] {0-9}[10]"placeholder="xx
xxxxxxxxxx"required><br><br>
<input type="image"src="https://www.utoledo.edu/incubator/mbac/images/submit-button-png-
hi.png"height="70px"width="140px"alt="CLICK HERE TO SUBMIT">
</form></body></html>
FORMS PROGRAM 18 -15
<!DOCTYPE HTML><html><head><title>Program 20</title></head><body
bgcolor="orange"align="center"><form method="POST">
NAME:- <input type="text"name="t1"placeholder="ENTER YOUR NAME"required><br><br>
CHOOSE FILE:-<input type="file"multiple><br><br>
WHICH IS YOUR FAVOURITE COLOR:- <input type="color"><br><br>
ADD YOUR HOMEPAGE:- <input type="url"><br><br>
<input type="submit"name="su1"value="SUBMIT">
</form></body></html>
FORMS PROGRAM 18 -15 (ignore the css part)
<!DOCTYPE HTML><html><head><title>Program 24</title><style>#h1{color:red;border:outset;border-
color:white;text-align:center;}</style></head><body bgcolor="pink"align="center"><h1 id="h1">USER
DATA</h1><form method="POST">
<b>Name:-<input type="text"name="t1"autocomplete><br><br>
Contact No:-<input type="tel"pattern="[0-9]{10}"><br><br>
Number of Years:-<input type="number"max="30"min="2"><br><br>
<input type="submit"name="su1"value="SUBMIT">
<input type="reset"name="re1"value="REFRESH">
</b></form></body></html>

FORMS PROGRAM 19 -16 (ignore the css part)


<!DOCTYPE HTML><html><head><title>Program 25</title></head><style>
#h1{color:white;border:double;border-color:white;text-align:center;}
#body{color:white;background-color:black;text-align:center;font-size:30px;}</style>
<body id="body"><h1 id="h1">JOB APPLICATION</h1><br><br>
<table><form method="POST">
<tr align="left"><td>USERNAME:-</td><td><input type="text"name="t1"autocomplete></td></tr>
<tr align="left"><td>MOBILE NO:-</td><td><input type="tel"pattern="[0-9]
{10}"placeholder="xxxxxxxxxx"required></td></tr>
<tr align="left"><td>LANDLINE NO:-</td><td><input type="tel"pattern="[0-9]{2} [0-9]{10}"
placeholder="xx xxxxxxxxxx"required></td></tr>
<tr align="left"><td>EMAIL ID:-</td><td><input type="email"autocomplete required </td></tr>
<tr align="left"><td>NUMBER OF YEARS OF EXPERIENCE:-</td><td><input
type="number"min="3"required></td></tr>
<tr align="left"><td>QUALIFICATION:-</td><td><input type="radio"name="r1">BCOM</td>
<td><input type="radio"name="r1">BMS &nbsp;&nbsp;</td>
<td><input type="radio"name="r1">BFM &nbsp;&nbsp;</td>
<td><input type="radio"name="r1">BBA</td></tr>
<tr align="left"><td>HOBBIES:-</td><td><select name="se1">
<option>Singing</option><option>Dancing</option>
<option>Reading</option><option>Swimming</option>
<option>Biking</option></select></td></tr>
<tr align="left"><td>UPLOAD YOUR CVV HERE:-</td>
<td><input type="file"multiple></td></tr>
<tr><td><input type="submit"name="s1"value="SUBMIT"></td><td>
<input type="reset"name="re1"value="REFRESH"></td></tr>
</form></table></body></html>

CAN MAKE ACTION W/ THANK YOU.HTML

You might also like