Skip to content

1905361_wtpracticals #131

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
manpreetlotay99 wants to merge 7 commits into
base: main
Choose a base branch
from
Open

1905361_wtpracticals #131

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
b347919
Create 1905361_prac1_html
manpreetlotay99 Apr 7, 2021
602e448
Create 1905361_prac2_html
manpreetlotay99 Apr 7, 2021
5c80948
Create 1905361_prac3_html
manpreetlotay99 Apr 7, 2021
7065ab3
Add files via upload
manpreetlotay99 May 14, 2021
5d93743
Add files via upload
manpreetlotay99 May 14, 2021
5539100
Add files via upload
manpreetlotay99 May 19, 2021
871cd51
Delete wtpractical.pdf
manpreetlotay99 May 19, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
20 changes: 20 additions & 0 deletions Section B/1905361_prac1_html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
<html>
<head>
<title>My first HTML page</title>
</head>
<body>
<img src="logo.png" alt="GNDEC logo" height="200px" width="1500px">
<h1> Welcome to GNDEC</h1>
<p> Guru Nanak Dev Engineering College, one of the prestigious, oldest and minority institution of Northern India, <br>
was established under the aegis of Nankana Sahib Education Trust (NSET) in 1956.</p>
<p>
The College was affiliated with Punjab University, Chandigarh since its inception. On establishment of Punjab Technical
University, Jalandhar, since 1997 the college is affiliated with it, which is now known as I.K.Gujral Punjab Technical
University (IKGPTU).
</p>


<h3> Link to the GNDEC site is</h3>
<a href="https://gndec.ac.in/" > Visit GNDEC official site</a>
<br>
</body>
47 changes: 47 additions & 0 deletions Section B/1905361_prac2_html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,47 @@
<!DOCTYPE html>
<html>
<body>

<h2>Details</h2>

<table style="width:100%">
<tr>
<th>Name</th>
<th>Age</th>
<th>Blog Link</th>
</tr>
<tr>
<td>Jill</td>
<td>50</td>
<td><a href="https://www.wix.com/">Jill</a></td>
</tr>
<tr>
<td>Eve</td>
<td>94</td>
<td><a href="https://www.wix.com/">Eve</a></td>
</tr>
<tr>
<td>John</td>
<td>80</td>
<td><a href="https://www.wix.com/">John</a></td>
</tr>
<tr>
<td>Doe</td>
<td>40</td>
<td><a href="https://www.wix.com/">Doe</a></td>
</tr>
<tr>
<td>Jackson</td>
<td>60</td>
<td><a href="https://www.wix.com/">Jackson</a></td>
</tr>
<tr>
<td>Jackson</td>
<td>60</td>
<td><a href="https://www.wix.com/">Smith</a></td>
</tr>

</table>

</body>
</html>
28 changes: 28 additions & 0 deletions Section B/1905361_prac3_html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,28 @@
<!DOCTYPE html>
<html>
<body>

<h1>HTML Form</h1>
<label for="fname">First name:</label>
<input type="text" id="fname" name="fname"><br><br>
<label for="lname">Last name:</label>
<input type="text" id="lname" name="lname"><br><br>



<label for="text area">Feedback:</label>
<textarea id="textareaa" name="Textarea" rows="4" cols="50"> </textarea>
<br><br>



<p>Gender:</p>
<input type="radio" id="male" name="gender" value="male">
<label for="male">Male</label><br>
<input type="radio" id="female" name="gender" value="female">
<label for="female">Female</label><br>
<br><br>

<input type="submit" value="Submit">
</body>
</html>
76 changes: 76 additions & 0 deletions Section B/1905361_prac5_css.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,76 @@
*{
margin:0;
padding: 0;
}

body{
margin: 0;
font-family: Arial, Helvetica, sans-serif;
font-size: 19px;
color:peru;
/* #926239; */
line-height: 1.6;
}

#showcase{
background-image: url("backgrnd.jpg");
background-size: cover;
background-position: center;
height:100vh;
display: flex;
justify-content: center;
flex-direction: column;
align-items: center;
text-align: center;
padding: 0 20px;
}

#showcase h1{
font-size: 50px;
line-height: 1.2;
}
#showcase p{
font-size: 20px;
}

#showcase .button{
font-size: 18px;
text-decoration: none;
color:peru;
border: peru 2px solid;
padding: 10px 20px;
border-radius: 4px;
margin-top: 25px;
}

#showcase .button:hover{
background-color: #cd853f;
color:#fff;
}
.section_a{
padding: 20px;
background: peru;
color:whitesmoke;
text-align: center;
}

.section_b{
padding: 20px;
background: #f4f4f4;
text-align: center;
}

#section_c{
display: flex;
}
#section_c div{
padding: 20px;
}

#section_c .box_1,#section_c .box_3{
background: peru;
color: whitesmoke;
}
#section_c .box_2{
background-color: #f9f9f9;
}
63 changes: 63 additions & 0 deletions Section B/1905361_prac5_html.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,63 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="1905361_prac5_css.css">
<title>Practical 5</title>
</head>
<body>
<header id="showcase">
<font color="white"><h1>My Website</h1>
<p> Lorem ipsum dolor sit amet, consectetur adipisicing elit.
Modi officiis ipsum officia numquam expedita ullam</font></p>
<a href="#" class="button">Read More</a>
</header>
<section class="section_a">
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Fugit minus impedit maxime,
quae soluta quis cumque perferendis! Doloribus quaerat, placeat iste facere, aspernatur
ex cum veritatis laudantium, officia, non porro exercitationem incidunt quis dolore?
Officia ex accusamus expedita optio, voluptatem minus? In maiores omnis aperiam earum
ab molestiae beatae laborum blanditiis incidunt, delectus dolor, id voluptates optio
aspernatur aliquam saepe atque labore? Tempore reprehenderit ab ipsam perspiciatis ut,
provident perferendis sapiente in numquam blanditiis, enim, illo error nulla incidunt
quos quidem ratione repellat ipsa molestias veritatis? Mollitia, fugit dolore commodi
porro repudiandae atque, eos, ipsum quam culpa fuga deleniti quae.
</p>
</section>

<section class="section_b">
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Fugit minus impedit maxime,
quae soluta quis cumque perferendis! Doloribus quaerat, placeat iste facere, aspernatur
ex cum veritatis laudantium, officia, non porro exercitationem incidunt quis dolore?
Officia ex accusamus expedita optio, voluptatem minus? In maiores omnis aperiam earum
ab molestiae beatae laborum blanditiis incidunt, delectus dolor, id voluptates optio
aspernatur aliquam saepe atque labore? Tempore reprehenderit ab ipsam perspiciatis ut,
provident perferendis sapiente in numquam blanditiis, enim, illo error nulla incidunt
quos quidem ratione repellat ipsa molestias veritatis? Mollitia, fugit dolore commodi
porro repudiandae atque, eos, ipsum quam culpa fuga deleniti quae.
</p>
</section>

<section id="section_c">
<div class="box_1">
Lorem ipsum dolor sit amet, consectetur adipisicing elit.
Modi officiis ipsum officia numquam expedita ullam!
</div>
<div class="box_2">
Lorem ipsum dolor sit amet, consectetur adipisicing elit.
Modi officiis ipsum officia numquam expedita ullam!
</div>
<div class="box_3">
Lorem ipsum dolor sit amet, consectetur adipisicing elit.
Modi officiis ipsum officia numquam expedita ullam!
</div>

</section>


</body>
</html>
138 changes: 138 additions & 0 deletions Section B/1905361_prac6_html.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,138 @@
<!doctype html>
<html lang="en">

<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css"
integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
<title>Practical 6</title>
</head>

<body>
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
<a class="navbar-brand" href="#">WT</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent"
aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">About</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button"
data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Topics
</a>
<div class="dropdown-menu" aria-labelledby="navbarDropdown">
<a class="dropdown-item" href="#">HTML</a>
<a class="dropdown-item" href="#">CSS</a>
<div class="dropdown-divider">JavaScript</div>
<a class="dropdown-item" href="#">Jquery</a>
<a class="dropdown-item" href="#">Ajax</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#">PHP</a>
<a class="dropdown-item" href="#">Bootstrap</a>
</div>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Contact Us</a>
</li>
</ul>
<form class="form-inline my-2 my-lg-0">
<input class="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search">
<button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button>
</form>
</div>
</nav>

<div id="carouselExampleIndicators" class="carousel slide carousel-fade" data-ride="carousel">
<ol class="carousel-indicators">
<li data-target="#carouselExampleIndicators" data-slide-to="0" class="active"></li>
<li data-target="#carouselExampleIndicators" data-slide-to="1"></li>
<li data-target="#carouselExampleIndicators" data-slide-to="2"></li>
</ol>
<div class="carousel-inner">
<div class="carousel-item active">
<img class="d-block w-100" src="https://source.unsplash.com/1400x300/?nature,water" alt="First slide">
<div class="carousel-caption d-none d-md-block">
<h2>First slide label</h2>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry.</p>
<button class="btn btn-danger">Technology</button>
<button class="btn btn-primary">Web Development</button>
<button class="btn btn-success">Tech Fun</button>
</div>

</div>
<div class="carousel-item">
<img class="d-block w-100" src="https://source.unsplash.com/1400x300/?nature,python" alt="Second slide">
<div class="carousel-caption d-none d-md-block">
<h2>second slide label</h2>
<p>It is a long established fact that a reader will be distracted by the readable content of a page
when looking at its layout. </p>
<button class="btn btn-danger">Technology</button>
<button class="btn btn-primary">Web Development</button>
<button class="btn btn-success">Tech Fun</button>
</div>
</div>
<div class="carousel-item">
<img class="d-block w-100" src="https://source.unsplash.com/1400x300/?nature,code" alt="Third slide">
<div class="carousel-caption d-none d-md-block">
<h2>Third slide label</h2>
<p>There is no one who loves pain itself, who seeks after it and wants to have it, simply because it
is pain...</p>
<button class="btn btn-danger">Technology</button>
<button class="btn btn-primary">Web Development</button>
<button class="btn btn-success">Tech Fun</button>
</div>
</div>
</div>
<a class="carousel-control-prev" href="#carouselExampleIndicators" role="button" data-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="carousel-control-next" href="#carouselExampleIndicators" role="button" data-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>

<div class="container my-4">
<div class="row mb-2">
<div class="col-md-6">
<div class="card flex-md-row mb-4 shadow-sm h-md-250">
<div class="card-body d-flex flex-column align-items-start">
<strong class="d-inline-block mb-2 text-primary">PHP</strong>
<p class="card-text mb-auto">Lorem Ipsum is simply dummy text of the printing and typesetting industry.</p>
<a href="#">Continue reading</a>
</div>
<img class="card-img-right flex-auto d-none d-lg-block" data-src="holder.js/200x250?theme=thumb"
alt="Thumbnail [200x250]" style="width: 200px; height: 250px;"
src="https://source.unsplash.com/500x700/?nature,water" data-holder-rendered="true">
</div>
</div>
<div class="col-md-6">
<div class="card flex-md-row mb-4 shadow-sm h-md-250">
<div class="card-body d-flex flex-column align-items-start">
<strong class="d-inline-block mb-2 text-success">JavaScript</strong>
<p class="card-text mb-auto">Lorem Ipsum is simply dummy text of the printing and typesetting industry.</p>
<a href="#">Continue reading</a>
</div>
<img class="card-img-right flex-auto d-none d-lg-block" data-src="holder.js/200x250?theme=thumb"
alt="Thumbnail [200x250]" src="https://source.unsplash.com/500x700/?nature,technology"
data-holder-rendered="true" style="width: 200px; height: 250px;">
</div>
</div>
</div>
</div>
</body>

</html>
13 changes: 13 additions & 0 deletions Section B/1905361_prac7_css.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
body{
background:-webkit-linear-gradient(left,#FFC0CB,#C0C0C0);
color:black;
}

input{
border-radius:15px;
border-bottom: 2px solid aqua;
height:45px;
width:25%;
color:black;
font-size: 15;
}
Loading