NAME: DHARSHANASHRI S
ROLL NO: CB.SC.U4CSE24314
SET NO.:1
Q.1
<!DOCTYPE html>
<html>
<head>
<title>SET-1 Q1</title>
<style>
table,td,tr,th{
border:1px solid rgb(3, 3, 3);
padding:5px;
margin:5px;
border-collapse: collapse;
width:60%;
}
thead{
background-color: rgb(31, 173, 31);
color:white;
padding:5px;
}
</style>
</head>
<body>
<table>
<thead>
<tr>
<th>Header Column 1</th>
<th>Header Column 2</th>
<th>Header Column 3</th>
<th colspan="2">Header Column 4</th>
</tr>
</thead>
<tbody>
<tr>
<td rowspan="1"><b>Row 2- Item 1</b><br/><i>Some italic
text</i></td>
<td rowspan="1">Row 2- Item 2<br/><p
style="color:blue">Blue Text</p></td>
<td>
<table>
<tr>
<td style="background-color: rgb(34, 140,
226); color:white;text-align:center">Row 1 Header</td>
<td align="center"><img src="C:\Users\exam\
Pictures\chaeom.jpg" alt="cat"></td>
</tr>
<tr><td style="background-color: rgb(34, 140,
226); color:white;text-align:center">Row 2 Header</td>
<td align="center">
<audio controls>
<source src="C:\Users\exam\Downloads\
CSE D\SoundHelix-Song-1.mp3" type="audio\mpeg" alt="audio"></source>
</audio></td></tr>
<tr><td style="background-color: rgb(34,
140, 226); color:white;text-align:center">Row 3 Header</td>
<td align="center"><img src="C:\Users\
exam\Pictures\chaeom.jpg" alt="cat"></td></tr>
</table></td>
<td rowspan="1" style="background-color: yellow;
color:red">Row 2- Item 4</b><br/><i>A second line</i></td>
</tr>
<tr>
<td><b>Row 2-nested table 2</td>
<td colspan="3">
<table width="100%">
<tr>
<td style="background-color: rgb(34,
140, 226); color:white;text-align:center">Row 1 Header</td>
<td align="center"><video controls
autoplay>
<source src="C:\Users\exam\
Downloads\CSE D\mov_bbb.mp4" alt="video" type="video\mp4"></source>
</video></td>
</tr>
<tr>
<td style="background-color: rgb(34,
140, 226); color:white;text-align:center">Row 2 Header</td>
<td align="center"> <img src="C:\Users\
exam\Pictures\chaeom.jpg" alt="cat"></td>
</tr>
</table>
</td>
</tr>
<tr>
<td style="text-decoration: underline;">Row 4-
item1</td>
<td><span style="background-color: yellow;">Row 4-
item 2</span></td>
<td><strong>Row 4-item 3</strong></td>
<td>Custom content</td>
</tr>
<tr><td colspan="4" style="background-color: rgb(191,
201, 201);text-align: left;"><b> Row 5-last row of outer
table</b></td></tr>
</tbody>
</table>
</body>
</html>
OUTPUT-1:
Q2
<!DOCTYPE html>
<html>
<head>
<title> set1 q2</title>
<style>
form{
height:700px;
width:500px;
}
</style>
</head>
<body>
<h1 align="center"><b>Comprehensive Technology Usage
Survey</b></h1>
<form style="align-items: center;">
<fieldset>
<legend>Personal Information</legend>
<label for="name" style="font-
weight:bold;">Name:</label><br/>
<input type="text" id="name" required
style="width:1000px" /><br/><br/>
<label for="age" style="font-
weight:bold;">Age:</label><br/>
<input type="text" id="age" required
style="width:1000px" /><br/><br/>
<label for="mail" style="font-
weight:bold;">Email:</label><br/>
<input type="email" id="mail" required
style="width:1000px"/><br/><br/>
<label for="dob" style="font-weight:bold;">Date of
Birth:</label><br/>
<input type="date" id="dob" required
style="width:1000px"/>
</fieldset>
<fieldset>
<legend>Device Ownership</legend>
<label for="Select" style="font-weight:bold;">Select
the device you own: </label><br/>
<textarea rowspan="8">Smartphone
Laptop
Desktop
Tablet
Computer
No device owned</textarea><br/><br/>
<label for="device" style="font-weight:bold;">Othert
Devices:</label><br/>
<input type="text" id="device" required
style="width:1000px" placeholder="Please specify other devices"/>
</fieldset>
<fieldset>
<legend>Usage Priorities</legend>
<label for="avg" style="font-weight:bold;">Average
daily use of device: </label>
<input type="range" id="avg" /><br/></br>
<label for="act" style="font-weight:bold;">Type of
Activities: </label><br>
<input type="checkbox" id="act"/>Work <br>
<input type="checkbox" id="act"/>Entertainment <br>
<input type="checkbox" id="act"/>Social <br><br>
<label for="dev" style="font-weight:bold;">Favourite
Application::</label><br/>
<input type="text" id="dev" required
style="width:1000px" placeholder="e.g. Whatsapp,Youtube"/>
</fieldset>
<fieldset>
<legend>Preferences and Future Interests</legend>
<label for="name1" style="font-weight:bold;">Technology
interests:</label><br/>
<textarea type="text" id="name1" required
style="width:1000px">Artificial intelligence
Machine Learning
</textarea><br/><br/>
<label for="wo">Would you be intersted in participating
in technology fields?</label><br/>
<input type="radio" id="wo" checked> Yes<br/>
<input type="radio" id="wo"> No
</fieldset>
<button type="sumbit" name="sumbit" value="sumbit"
style="background-color: green;color:white;border-
color:green;width:150px">SUBMIT</button>
<INPUT TYPE="RESET" VALUE="RESET" style="background-
color:red;color:white;border-color: red;width:150px"/>
</form>
</body>
</html>
OUTPUT-2: