Location via proxy:   [ UP ]  
[Report a bug]   [Manage cookies]                
Scribd
Upload
61 views26 pages

Pankajrawat

Uploaded by

successsure095

Copyright:

© All Rights Reserved
Download as PDF, TXT or read online from Scribd
Download as pdf or txt

Pankajrawat

Uploaded by

successsure095
61 views26 pages

Original Title

pankajrawat

Copyright

© © All Rights Reserved

Available Formats

PDF, TXT or read online from Scribd

Did you find this document useful?

Is this content inappropriate?

Copyright:

© All Rights Reserved
Download as PDF, TXT or read online from Scribd
Download as pdf or txt
61 views26 pages

Pankajrawat

Uploaded by

successsure095

Copyright:

© All Rights Reserved
Download as PDF, TXT or read online from Scribd
Download as pdf or txt
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