Create a simple HTML code to display following table as output:
Create a simple HTML page on any of the following topic:
College Profile, Computer manufacturer or Software development company
a) The
page must consist of a scrolling marquee displaying an appropriate
message.
b) The page must include a table with at least 5 rows and 3 columns
having merged cells at least at one place.
The page must display an image; an appropriate text message should be
displayed.
An <!DOCTYPE html>
s <html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Software Development Company</title>
<style>
body {
font-family: Arial, sans-serif;
}
.marquee {
font-size: 20px;
color: #000;
background-color: #f4f4f4;
padding: 10px;
}
table {
width: 80%;
margin: 20px auto;
border-collapse: collapse;
}
table, th, td {
border: 1px solid #ddd;
}
th, td {
padding: 10px;
text-align: center;
}
th {
background-color: #f2f2f2;
}
img {
width: 200px;
height: 150px;
}
</style>
</head>
<body>
<!-- Marquee -->
<div class="marquee">
<marquee>Welcome to XYZ Software Development Company! We specialize in
innovative software solutions.</marquee>
</div>
<!-- Table -->
<table>
<tr>
<th>Department</th>
<th>Employee</th>
<th>Position</th>
</tr>
<tr>
<td rowspan="2">Development</td>
<td>John Doe</td>
<td>Senior Developer</td>
</tr>
<tr>
<td>Jane Smith</td>
<td>Junior Developer</td>
</tr>
<tr>
<td>Marketing</td>
<td>Mary Johnson</td>
<td>Marketing Manager</td>
</tr>
<tr>
<td>HR</td>
<td>James Brown</td>
<td>HR Manager</td>
</tr>
<tr>
<td>Sales</td>
<td>Emily Davis</td>
<td>Sales Executive</td>
</tr>
</table>
<!-- Image and Hyperlink -->
<div style="text-align: center;">
<a href="https://www.example.com">
<img src="https://via.placeholder.com/200x150.png" alt="Company Image">
</a>
<p>Click the image to visit our official website!</p>
</div>
</body>
</html>
Output:
Create a simple HTML page on any of the following topic:
Qu
College Profile, Computer manufacturer or Software development company
a) The page must consist of at least 3 paragraphs of test.
b) Page must have an appropriate title background color or image and
hyperlink to next page.
The paragraph must have text consisting of different colors and style in terms
of alignment and font size.
<!DOCTYPE html>
An <html lang="en">
s <head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>XYZ Software Development Company</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f4f4f4;
}
header {
background-color: #333;
color: #fff;
padding: 20px;
text-align: center;
}
h1 {
font-size: 36px;
}
p{
font-size: 18px;
margin: 20px 0;
}
.red-text {
color: red;
font-weight: bold;
}
.blue-text {
color: blue;
text-align: right;
font-size: 22px;
}
.green-text {
color: green;
font-style: italic;
text-align: center;
}
footer {
text-align: center;
margin-top: 40px;
}
a{
color: #007BFF;
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
</style>
</head>
<body>
<!-- Header Section -->
<header>
<h1>Welcome to XYZ Software Development Company</h1>
</header>
<!-- Paragraphs with different text colors, styles, and alignment -->
<p class="red-text">XYZ Software Development Company is dedicated to
creating innovative solutions that drive the future of technology. Our team
works tirelessly to deliver cutting-edge software products.</p>
<p class="blue-text">With over 10 years of experience in the software
industry, we have successfully partnered with businesses worldwide to
enhance their digital capabilities. Our skilled developers specialize in both
web and mobile applications.</p>
<p class="green-text">At XYZ, we believe in continuous improvement. Our
software is built with the best practices in mind, ensuring high performance,
security, and scalability for our clients.</p>
<!-- Link to another page -->
<footer>
<p><a href="https://www.example.com">Click here to learn more about
our services!</a></p>
</footer>
</body>
</html>
Output:
