Lab 1 HTML
Q1:
<body>
<h1>This is Header One</h1>
<h2>This is Header Two</h2>
<h3>This is Header Three</h3>
<h4>This is Header Four</h4>
<h5>This is Header Five</h5>
<h6>This is Header Six</h6>
<b> This is Bold</b>
<i> This is Italic</i>
<u> This is Underline</u>
Superscript: 2<sub>10</sub>=1024
Subscript: H<sub>2</sub>O
<strong> This is Strong</strong>
<em> This is Emphasis</em>
<big>This is Big</big>
<small>This is Small</small>
<font size ="6"> This is Font Size=6</font>
<font size ="5"> This is Font Size=5</font>
<font size ="4"> This is Font Size=4</font>
<font size ="3"> This is Font Size=3</font>
<font size ="2"> This is Font Size=2</font>
<font size ="1"> This is Font Size=1</font>
<font face="Times New Roman"> This is Times New Roman</font>
<font face="Arial"> This is Arial</font>
<font face="Courier"> This is Courier</font>
<font face="Comics Sans MS"> This is Commic Sans MS</font>
<font face="Webdings"> This is Webdings</font>
<font face="WingDings"> This is WingDings</font>
</body>
Output:
Q2:
body>
<b>Unordered Lists</b>
<ul>
<li>Today</li>
<li>Tomorrow</li>
<li>Yesterday</li>
</ul>
<b>Unordered Lists</b>
<ul>
<li>Today</li>
<li>Tomorrow</li>
<li>Yesterday</li>
<ul>
<li>123</li>
<li>456</li>
<li>789</li>
<ul>
<li>abc</li>
<li>pqr</li>
<li>xyz</li>
</ul>
</ul>
</ul>
<b>Ordered Lists</b>
<ol>
<li>Today</li>
<li>Tomorrow</li>
<li>Yesterday</li>
</ol>
<b>Ordered Lists</b>
<ol>
<li>Today</li>
<li>Tomorrow</li>
<li>Yesterday</li>
<ol>
<li>123</li>
<li>456</li>
<li>789</li>
<ol>
<li>abc</li>
<li>pqr</li>
<li>xyz</li>
</ol>
</ol>
</ol>
<b>Definition Lists</b>
<dl>
<dt>Today</dt>
<dd>Today will be yesterday</dd>
<dt>Tomorrow</dt>
<dd>Tomorrow will be today</dd>
</dl>
<b>Mark Styles</b>
<ul>
<li type="disc">disc</li>
<li type="circle">circle</li>
<li type="square">square</li>
</ul>
<b>Capital Letters</b>
<ol type="A">
<li>ONE-ONE</li>
<li>TWO-TWO</li>
<li>THREE-THREE</li>
</ol>
<ol type="a">
<li>one-one</li>
<li>two-two</li>
<li>three-three</li>
</ol>
<b>Romanized</b>
<ol type="I">
<li>one-one</li>
<li>two-two</li>
<li>three-three</li>
</ol>
<ol type="i">
<li>one-one</li>
<li>two-two</li>
<li>three-three</li>
</ol>
<b>Number</b>
<ol type="1">
<li>ONE-ONE</li>
<li>TWO-TWO</li>
<li>THREE-THREE</li>
</ol>
<ol start=5>
<li type=A>ONE-ONE</li>
<li>ONE-TWO</li>
<ol start=10>
<li>TWO-ONE</li>
<li type=i>TWO-ONE</li>
</ol>
</ol>
</body>
Output:
Q3:
<body>
<table border>
<tr>
<td>Food</td>
<td>Drink</td>
<td>Sweet</td>
</tr>
<tr>
<td>A</td>
<td>B</td>
<td>C</td>
</tr>
</table>
<table border>
<tr>
<th>Food</th>
<th>Drink</th>
<th>Sweet</th>
</tr>
<tr>
<td>A</td>
<td>B</td>
<td>C</td>
</tr>
</table>
<table border="5">
<tr>
<th>Food</th>
<th>Drink</th>
<th>Sweet</th>
</tr>
<tr>
<td>A</td>
<td>B</td>
<td>C</td>
</tr>
</table>
<table border cellspacing="10">
<tr>
<th>Food</th>
<th>Drink</th>
<th>Sweet</th>
</tr>
<tr>
<td>A</td>
<td>B</td>
<td>C</td>
</tr>
</table>
<table border cellpadding="10">
<tr>
<th>Food</th>
<th>Drink</th>
<th>Sweet</th>
</tr>
<tr>
<td>A</td>
<td>B</td>
<td>C</td>
</tr>
</table>
<table border width="200" height="100">
<tr>
<th width="50" height="70">Food</th>
<th>Drink</th>
<th>Sweet</th>
</tr>
<tr>
<td>A</td>
<td>B</td>
<td>C</td>
</tr>
</table>
<table>
<tr>
<th>Food</th>
<th>Drink</th>
<th>Sweet</th>
</tr>
<tr>
<td>A</td>
<td>B</td>
<td>C</td>
</tr>
</table>
<table border>
<tr>
<th colspan="3">Morning Menu</th>
</tr>
<tr>
<th>Food</th>
<th>Drink</th>
<th>Sweet</th>
</tr>
<tr>
<td>A</td>
<td>B</td>
<td>C</td>
</tr>
</table>
<table border>
<tr>
<th rowspan="3">Morning Menu</th>
<th>Food</th>
<td>A</td>
</tr>
<tr>
<th>Drink</th>
<td>B</td>
</tr>
<tr>
<th>Sweet</th>
<td>C</td>
</tr>
</table>
<table border="1" width="160">
<tr>
<th>Food</th>
<th>Drink</th>
<th>Sweet</th>
</tr>
<tr>
<td align="left">A</td>
<td align="center">B</td>
<td align="right">C</td>
</tr>
</table>
<table border="1" height="100">
<tr>
<th>Food</th>
<th>Drink</th>
<th>Sweet</th>
<th>Other</th>
</tr>
<tr>
<td valign="top">A</td>
<td valign="middle">B</td>
<td valign="bottom">C</td>
<td valign="baseline">D</td>
</tr>
</table>
</body>
Output:
Q4:
<body>
<h2>Sample HTML5 Form</h2>
<form action="#" method="post">
<label for="email">Email: *</label><br>
<input type="email" id="email" name="email" required><br><br>
<label for="password">Password: *</label><br>
<input type="password" id="password" name="password" required><br><br>
<label for="birthdate">Date of Birth:</label><br>
<input type="date" id="birthdate" name="birthdate"><br><br>
<label for="website">Website URL:</label><br>
<input type="url" id="website" name="website"><br><br>
<label for="favcolor">Favorite Color:</label><br>
<input type="color" id="favcolor" name="favcolor"><br><br>
<label for="quantity">Number (1-100):</label><br>
<input type="number" id="quantity" name="quantity" min="1" max="100"><br><br>
<input type="submit" value="Submit">
</form>
</body>
Output:
