Scribd
Upload
77 views26 pages

Pankajrawat

Uploaded by

successsure095
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
77 views26 pages

Pankajrawat

Uploaded by

successsure095
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 26

Question 1:- Write HTML code to show the Functioning of Title tag?

Program:-

<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Title Example</title>
</head>

<body>
<h1>Welcome to My Website</h1>
<p>This is a simple example to demonstrate the functioning of the <title> tag
in HTML.</p>
</body>

</html>

Screenshot:-
Question 2:- Write HTML code to show Implementation of table tag?

Program:-

<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Table Example</title>
</head>

<body>
<h1>Student Grades</h1>
<table border="1">
<thead>
<tr>
<th>Student Name</th>
<th>Math</th>
<th>Science</th>
<th>English</th>
</tr>
</thead>
<tbody>
<tr>
<td>John Doe</td>
<td>90</td>
<td>85</td>
<td>88</td>
</tr>
<tr>
<td>Jane Smith</td>
<td>92</td>
<td>88</td>
<td>90</td>
</tr>
<tr>
<td>Michael Johnson</td>
<td>85</td>
<td>90</td>
<td>82</td>
</tr>
</tbody>
</table>
</body>
</html>

Screenshot:-
Question 3:- Write HTML code to show the Implementation of <div> tag?

Program:-

<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Div Example</title>
<style>
/* CSS for styling the divs */
.container {
border: 1px solid #ccc;
padding: 20px;
margin-bottom: 20px;
}

.red-box {
background-color: #ff9999;
color: #fff;
padding: 10px;
}

.blue-box {
background-color: #99ccff;
color: #000;
padding: 10px;
}
</style>
</head>
<body>
<div class="container">
<p>This is a simple example of using the <code>&lt;div&gt;</code> tag to
create divisions or containers.</p>
</div>

<div class="container red-box">


<p>This div has a red background color.</p>
</div>

<div class="container blue-box">


<p>This div has a blue background color.</p>
</div>
</body>

</html>

Screenshot:-
Question 4:- Write HTML code to show Implementation Frame?

Program:-

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>IFrame Example</title>
</head>
<body>
<h1>IFrame Example</h1>
<p>Below is an iframe displaying the OpenAI website:</p>
<iframe src="https://www.openai.com/" width="800" height="600"
frameborder="0"></iframe>
</body>
</html>

Screenshot:-

Screenshot:-
Question 5:- Write HTML code to show Order List?

Program:-

<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Ordered List Example</title>
</head>

<body>
<h1>Ordered List Example</h1>
<p>This is an example of an ordered list in HTML:</p>
<ol>
<li>First item</li>
<li>Second item</li>
<li>Third item</li>
<li>Fourth item</li>
</ol>
</body>

</html>

Screenshot:-
Question 6:- Write HTML code to show Unordered List?

Program:-

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Unordered List Example</title>
</head>
<body>
<h1>Unordered List Example</h1>
<p>This is an example of an unordered list in HTML:</p>
<ul>
<li>First item</li>
<li>Second item</li>
<li>Third item</li>
<li>Fourth item</li>
</ul>
</body>
</html>

Screenshot:-
Question 7:- Write HTML code to show Function of Text Box?

Program:-

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Text Box Example</title>
</head>
<body>
<h1>Text Box Example</h1>
<form>
<label for="username">Username:</label>
<input type="text" id="username" name="username">
<br><br>
<label for="password">Password:</label>
<input type="password" id="password" name="password">
<br><br>
<input type="submit" value="Submit">
</form>
</body>

</html>

Screenshot:-
Question 8:- Write HTML code to show the utility of meta tag as well as alt
tag?

Program:-

<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="This is a website about fruits and
vegetables.">
<title>Meta Tag and Alt Tag Example</title>
</head>

<body>
<h1>Website about Fruits and Vegetables</h1>
<p>Welcome to our website! We offer a variety of fresh fruits and
vegetables.</p>
<img src="fruit.jpg" alt="Fresh apples and oranges">
</body>

</html>

Screenshot:-
Question 9:- Write HTML code to Implement all Singular Tag?

Program:-

<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Singular Tags Example</title>
</head>

<body>
<!-- Singular Tags -->
<br>
<hr>
<img src="
https://www.lkouniv.ac.in/site/writereaddata/siteContent/LU_Logo-
JPG_100220.jpg " alt="Example Image">
<input type="text" placeholder="Enter your name">
<link rel="stylesheet" href="styles.css">
<meta name="description" content="This is a description">
<base href="https://www.example.com/">
<area shape="rect" coords="0,0,100,100"
href="https://www.example.com/">
<col width="50">
<param name="autoplay" value="true">
<source src="video.mp4" type="video/mp4">
<track src="subtitles_en.vtt" kind="subtitles" srclang="en" label="English">
<wbr>
</body>

</html>

Screenshot:-
Question 10:- Write HTML code to show all Paired tag?
Program:-

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Paired Tags Example</title>
</head>
<body>
<!-- Paired Tags -->
<h1>Heading Level 1</h1>
<p>Paragraph text goes here.</p>
<a href="https://www.example.com">Link to Example</a>
<strong>Bold Text</strong>
<em>Italic Text</em>
<span style="color: red;">Span with Inline Style</span>
<div>
<p>This is a paragraph inside a div.</p>
<ul>
<li>List item 1</li>
<li>List item 2</li>
<li>List item 3</li>
</ul>
</div>
<form action="/submit-form" method="POST">
<label for="username">Username:</label>
<input type="text" id="username" name="username">
<br>
<label for="password">Password:</label>
<input type="password" id="password" name="password">
<br>
<input type="submit" value="Submit">
</form>
</body>
</html>

Screenshot:-
Question 11:- Write HTML code to implement row span and col span?

Program:-

<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Rowspan and Colspan Example</title>
<style>
table {
border-collapse: collapse;
width: 100%;
}

th,
td {
border: 1px solid black;
padding: 8px;
}
</style>
</head>
<body>
<h1>Rowspan and Colspan Example</h1>
<table>
<tr>
<th colspan="2">Employee Information</th>
</tr>
<tr>
<td rowspan="2">John Doe</td>
<td>IT</td>
</tr>
<tr>
<td>Finance</td>
</tr>
<tr>
<td colspan="2">Jane Smith</td>
</tr>
</table>
</body>
</html>
Screenshot:-
Question 12:- Write HTML code to implemented cell spacing cell padding?

Program:-

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Cell Spacing and Cell Padding</title>
<style>
table {
border-collapse: separate;
/* Allows cell spacing */
border-spacing: 10px;
/* Sets cell spacing */
}

th,
td {
padding: 20px;
/* Sets cell padding */
border: 1px solid black;
}
</style>
</head>
<body>
<h1>Cell Spacing and Cell Padding </h1>
<table>
<tr>
<th>Name</th>
<th>Department</th>
</tr>
<tr>
<td>John Doe</td>
<td>IT</td>
</tr>
<tr>
<td>Jane Smith</td>
<td>Finance</td>
</tr>
</table>
</body>
</html>
Screenshot:-
Question 13:- Write HTML code to show functioning of Inline CSS?

Program:-

Inline CSS code is written in the HTML tags

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Inline CSS Example</title>
</head>
<body>
<h1 style="color: blue; font-family: Arial, sans-serif;">Inline CSS
Example</h1>
<p style="font-size: 16px; line-height: 1.5;">This is an example of using
inline CSS styles within HTML elements.</p>
<div style="background-color: #f0f0f0; padding: 10px;">
<p style="font-style: italic; color: green;">This paragraph is inside a div
with inline CSS styles applied.</p>
</div>
</body>
</html>

Screenshot:-
Question 14:- Write HTML code to Implement Internal and External CSS?

Screenshot:-

Implement Internal CSS using style tag and defining the CSS properties.

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Internal CSS Example</title>
<style>
body {
font-family: Arial, sans-serif;
}
h1 {
color: blue;
}
p{
font-size: 16px;
line-height: 1.5;
}
</style>
</head>
<body>
<h1>Internal CSS Example</h1>
<p>This is an example of using internal CSS styles within the &lt;style&gt;
tag.</p>
</body>
</html>

Screenshot:-
Implement External CSS using link tag and the CSS properties.
HTML:-

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>External CSS Example</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<h1>External CSS Example</h1>
<p>This is an example of using external CSS styles linked with the
&lt;link&gt; tag.</p>
</body>
</html>

CSS:-

body {
font-family: Arial, sans-serif;
}
h1 {
color: blue;
}
p{
font-size: 16px;
line-height: 1.5;
}
Screenshot:-
Question 15:- ?

Program:- <!DOCTYPE html>


<html>
<head>
<title>Home</title>
<link rel="stylesheet" href="pankajkumar.css">
</head>
<body>
<div class="container">
<img src="https://www.lkouniv.ac.in/images/logo.png" class="logo">
</div>
<!---------- Main Menu HTML Starts --------->
<nav>
<div class="container">
<a href="https://www.lkouniv.ac.in/en">Home</a>
<a href="https://www.lkouniv.ac.in/en/page/university-at-a-glance">About
us</a>
<a href="https://www.lkouniv.ac.in/en/page/academic-
calendar">Academics</a>
<a href="https://www.lkouniv.ac.in/en/page/counselling-and-placement-
cell">Facilitiesy</a>
<a href="http://www.lkouniv.ac.in/article/en/awards">Research</a>
<a href="https://www.lkouniv.ac.in/en/page/cooperative-lending-
library">Library</a>
<a href="https://www.lkouniv.ac.in/en/news?Newslistslug=en-examination-
schedule&cd=OAA1AA%3D%3D">Examination</a>
<a
href="https://www.lkouniv.ac.in/site/writereaddata/siteContent/2021010108164
99279annual_report.pdf">Media</a>
<a href="https://www.lkouniv.ac.in/en/page/current-openings">Career</a>
<a href="https://www.lkouniv.ac.in/article/en/contact-dir">Contact us</a>
<a
href="http://udrc.lkouniv.ac.in/student?cd=MQAzADYAOQA2AA%3D%3D">
UDRC </a>
</div>
</nav>
<!---------- Main Menu HTML Ends --------->
<!---------- Slider HTML Starts --------->
<div class="slider">
<img
src="https://www.lkouniv.ac.in/site/writereaddata/HomePage/Header/H_202205
191310297070.jpg">
</div>
<!---------- Slider HTML Ends --------->
/********** Common CSS Starts **********/ *

margin:0px;

padding:0px;

html, body {

font-family Roboto, sans-serif, arial;

font-size: 14px;

color: #242424;

.container {

width: 1200px;

margin:0px auto;

.main-section {

width: 100%;

float: left;

padding:50px 0px 40px 0px;

.heading {

font-size: 22px;

font-weight: 500;

border-bottom: 1px solid #ff5722;

margin-bottom:25px;

color: #ff5722;

.logo {

width:100%;

}
nav {

width: 100%;

float: left;

background: #ff5722;

padding:15px 0px;

nav a {

color: #fff;

text-decoration: none;

font-size: 17px;

border-right: 1px solid #ffc3c3;

padding:2px 20px;

/********** Slider CSS Starts **********/

.slider img {

width:100%;

/********** Slider CSS Ends **********/

/********** News, Event, Notice Board CSS Starts **********/

.event {

width: 31%;

margin-right: 1%;

float: left;

.event div {

padding:10px;

background-color: #f0f3fa;

.event ul li {

margin-bottom: 20px;

width: 100%;
float: left;

/********** News, Event, Notice Board CSS Ends **********/

/********** About Us CSS Starts **********/

.about-us img {

width:24%;

float:left;

.about-us div {

width:70%;

margin-left:20px;

float:left;

line-height:35px;

/********** About Us CSS Ends **********/

/********** Gallery CSS Starts **********/

.gallery img {

width: 24%;

/********** Gallery CSS Ends **********/

/********** Placement CSS Starts **********/

.placement img {

border:1px solid #dfdfdf;

/********** Placement CSS Ends **********/

/********** Footer CSS Starts **********/

.footer {

background-color:#1f2836;

padding:70px 0px;

width:100%;

float:left;
}

.footer-sect {

width:33%;

float:left;

.footer-sect h2 {

color:#fff;

margin-bottom: 20px;

.footer-sect p {

color: #fff;

line-height: 22px;

padding:0px 30px 20px 0px;

.footer-menu li {

width: 50%;

float: left;

margin-bottom: 10px;

.footer-menu li a {

color:#fff;

text-decoration: none;

.footer-contact li {

margin-bottom:15px;

list-style: none;

color: #fff;

/********** Footer CSS Ends **********/


Screenshot:-

You might also like

pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy