Lab-1 Web Technology
Program :- Write html for different types of List.
Output:
Code:
<html>
<head>
<title>Different Types of Lists</title>
</head>
<body>
<h2>Unordered List</h2>
<ul>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
</ul>
Lab-1 Web Technology
<h2>Ordered List</h2>
<ol>
<li>First Item</li>
<li>Second Item</li>
<li>Third Item</li>
</ol>
<h2>Description List</h2>
<dl>
<dt>Term 1</dt>
<dd>Definition 1 - This is a description of the first term.</dd>
<dt>Term 2</dt>
<dd>Definition 2 - This is a description of the second term.</dd>
</dl>
</body>
</html>
Lab-1 Web Technology
Program:- Write html to make a Image clickable
Code:
<html>
<head>
<title>Clickable Image Example</title>
</head>
<body>
<a href="https://www.example.com">
<img src="C:\Users\91920\Desktop\hi.jpg" alt="Descriptive Text for the Image" align ="center">
</a>
</body>
</html>
Lab-1 Web Technology
Lab 1:- Write html to display CV
Lab-1 Web Technology
Code:
<html lang="en">
<head>
<title>Ankit Dhar Dwivedi's CV</title>
<style> body, html {
margin: 0;
padding: 0;
font-family: Arial, sans-serif;
.container {
width: 80%;
margin: auto;
overflow: hidden;
header h1 {
color: #333;
header p, header a {
color: #666;
a{
text-decoration: none;
color: #007bff;
a:hover {
Lab-1 Web Technology
text-decoration: underline;
section h2 {
background-color: #f4f4f4;
padding: 10px;
border-bottom: 2px solid #e4e4e4;
section ul {
list-style-type: none;
padding: 0;
section ul li {
background-color: #f9f9f9;
margin-bottom: 2px;
padding: 10px;
border-left: 3px solid #007bff;
footer {
background-color: #f4f4f4;
text-align: center;
padding: 10px;
margin-top: 20px;
</style>
</head>
<body>
<div class="container">
Lab-1 Web Technology
<header align="center">
<h1>Ankit Dhar Dwivedi</h1>
<p>176/6 Amar market Badarpur New Delhi</p>
<p>9205706245 | <a
href="mailto:[email protected]">[email protected]</a></p>
<p><a href="https://www.linkedin.com/in/ankit-dhar-dwivedi-4a7831220">LinkedIn
Profile</a></p>
</header>
<section class="objective">
<h2>Objective</h2>
<p>To work in an environment which encourages me to succeed and grow professionally
where I can utilize my skills and knowledge appropriately.</p>
</section>
<section class="education">
<h2>Education</h2>
<ul>
<li>B.Tech(Computer Science Engineering) - G. L. Bajaj Institute of Technology and
Management, Greater Noida(2021-2025)</li>
<li>Intermediate - G.S.V.S.B.V Sarojini Nagar, New Delhi(2020)</li>
<li>Highschool - G.B.S.S.School no.3 Sarojini nagar, New Delhi(2018)</li>
</ul>
</section>
<section class="achievements">
<h2>Achievements & Awards</h2>
<ul>
<li>GeeksforGeeks solved: 200</li>
<li>Leetcode solved: 100</li>
<li>Hackerrank solved: 50</li>
<li>Codechef solved: 100</li>
</ul>
</section>
<section class="skills">
Lab-1 Web Technology
<h2>Skills</h2>
<ul>
<li>Data Structures & Algorithms</li>
<li>C Language</li>
<li>Java Language</li>
<li>HTML, CSS</li>
<li>Familiar: Python</li>
</ul>
</section>
<section class="projects">
<h2>Projects</h2>
<ul>
<li>Netflix clone</li>
<p>It replicates the Netflix clone website.Language used Html,Css ,Javascript</p>
<li>Temperature converter webpage</li>
<p>It is temperature converter webpage that convert the celsius to fahrenheit</p>
</ul>
</section>
</div>
</body>
</html>
