Scribd
Upload
11 views

Solution HTML Practical

The document provides code snippets to demonstrate different HTML elements and tags. It includes examples of inserting tables, setting body color and images, adding hyperlinks, formatting text, and creating forms with various input fields like text, radio buttons, dropdowns and more.

Uploaded by

sohaibkashif49
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
11 views

Solution HTML Practical

The document provides code snippets to demonstrate different HTML elements and tags. It includes examples of inserting tables, setting body color and images, adding hyperlinks, formatting text, and creating forms with various input fields like text, radio buttons, dropdowns and more.

Uploaded by

sohaibkashif49
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 5

HTML Practical:

Write the code to insert the following table in html.

Mark Sheet in HTML

Question # Total Marks Marks Obtained


1 20 75
2 30 85
Total 50 150
<html>
<head>
<title>Tables in HTML</title>
</head>

<body>
<table width="50%" border="1">
<thead><b>Mark sheet in HTML</b></thead>
<tr>
<th><b>Question #</th>
<th><b>Total Marks</th>
<th><b>Marks Obtained</th>
</tr>
<tr>
<td align="center">1</td>
<td align="center">20</td>
<td align="center">75</td>
</tr>
<tr>
<td align="center">2</td>
<td align="center">30</td>
<td align="center">85</td>
</tr>
<tr>
<td align="center"><i><b>Total></b></i></td>
<td align="center"><i><b>50</b></i></td>
<td align="center"><i><b>150</b></i></td>
</tr>
</table>
</body>
</html>

Write the code to set the body color sky blue and insert the image on right-aligned in the page of html.
<html>
<head>
<title>Tables in HTML</title>
</head>

<body bgcolor="skyblue">
<img src="mypicture.jpg" width="400" height="300" align="right">
</body>
</html>
Write the code to insert a hyper link of the website http://www.PU.edu.pk to the text “PU Website”.
<html>
<head>
<title>Tables in HTML</title>
</head>

<body>
<a href="http://www.pu.edu.pk">PU website</a>
</body>
</html>

Write the code to insert a hyper link of the website http://www.PU.edu.pk to an image.
<html>
<head>
<title>Tables in HTML</title>
</head>

<body>
<a href="http://www.pu.edu.pk">
<img src="mypicture.jpg" width="150" height="150">
</a>
</body>
</html>

Write the code to format a paragraph with font Times New Roman, size 5, color red and aligned-centered of the page.
Also apply Bold and Italic effect on some word of this paragraph.
<html>
<head>
<title>Tables in HTML</title>
</head>

<body>
<p>
<center>
<font face="Times new roman" size="5" color="red">
Computer is an electronic device, which is used to
take data as <b>input</b>, <i>process</i> the data, gives us <b>output</b> in the
form of result and store it for communication in futur use.
</center>
</font>
</body>
</html>
Write the code to complete the form in HTML:
<html>
<head>
<title>Form</title>
</head>

<body>
<form>
<label>Salution<br>
<select>
<option>--None--</option>
<option>--Male----</option>
<option>--Female--</option>
</select><br>
<label>First Name:<input tyep="text"><br>
<label>Last Name:<input tyep="text"><br>
<label>Gender:
<input type="radio" name="gen"><label>Male

<input type="radio"
name="gen"><label>Female<br>
<label>Email:<input tyep="text"><br>
<label>Date of Birth:<input type="date"><br>
<label>Address:<br>
<textarea col="50" rows="3"></textarea><br>
<input type="Submit" value="Submit">
</body>
</html>

<html>
<head>
<title>Form</title>
</head>

<body>
User info form:
<hr>
<form>
<label>Name:<input tyep="text"><br>
<label>Password:<input tyep="password"><br>
<label>Party:<br>
<input type="radio" name="party"><label>Democrat<br>
<input type="radio" name="party"><label>Republican<br>
<label>State:<br>
<select>
<option>Oregon</option>
<option>Newyork</option>
<option>Clifton</option>
</select><br>
<label>Comments:<br>
<textarea col="50" rows="3"></textarea><br>
<label>Send me more information: <input type="checkbox"><br>
<input type="reset" value="Clear Form">
<input type="Submit" value="Send Info">
</body>
</html>
<html>
<head>
<title>Form</title>
</head>

<body>
<h1>Order pizza!</h1>
<form>
<label><b>Select the pizza size:</b><br>
<input type="radio" name="size"><label>Big<br>
<input type="radio" name="size"><label>Medium<br>
<input type="radio" name="size"><label>Small<br>

<label>Select the crust type:<br>


<select>
<option>Deep Dish</option>
<option>Extra Deep Dish</option>
<option>Thin Dish</option>
</select><br>

<label><b>Select the pizza size:</b><br>


<input type="checkbox" ><label>Sausage<br>
<input type="checkbox" ><label>Pepper<br>
<input type="checkbox" ><label>Mushrooms<br>

<label>Name:<input tyep="text"><br>
<label>Phone:<input tyep="text"><br>

<textarea col="50" rows="3">Message:</textarea><br>


<label>Send your CV: <input type="file"><br>
<input type="Submit" value="Send">
<input type="reset" value="Reset">

</body>
</html>

You might also like