20BCE2114

NAME  MAYANK YADAV
REG. NO  20BCE2114
DIGITAL ASSIGNMENT
CSE3002
INTERNET AND WEB PROGRAMMING
SUBMITTED TO-- SUBMITTED BY--

MEENAKSHI S P MAYANK YADAV
(20BCE2114)
QUESTION 1:
Exercise: 1
1. IDE – Netbeans – Explore the features of netbeans for webpage development

2. Create a html file in the ide, explore the structure of the basic html file containing the
elements, i.e, doctype, head,title, meta, body,html
3. Refer w3schools page and learn the syntax for Displaying headings, ordered list, unordered
list and divisions
4. Include the heading, list, division elements in the basic html file
5. Display the file in the browser
6. Explore websites of specific category i.e, ecommerce sites, sports sites, stockmarket sites,
network monitoring sites for the features present.
CODE:
<!DOCTYPE html>
<html>
<head>
<style>
.headingtag {
border: 5px outset red;
background-color: lightblue;
text-align: center;
}
</style>
<title>Page Title</title>
</head>
<body>
<h1 align="center">DIGITAL ASSIGNMENT</h1>

<p></p>
<div class="headingtag">
<h1>This is a heading tag in a div element</h1>
<p>This is some text in a div element.</p>
</div>
<div class="ol">
<h1>ORDERED LISTS</h1>
<ol>
<li>HTML</li>
<li>CSS</li>
<li>JAVASCRIPT</li>
</ol>
</div>
<div class="uol">
<h1>UNORDERD LISTS</h1>
<ul>
<li>NODE JS</li>
<li>MONGO DB</li>
<li>REACT</li>
</ul>

</div>
</body>
</html>
SCREENSHOT:
QUESTION 2
1 ) HEAD REQUEST
COMMAND: curl -I --http2 https://www.amazon.com/Copy
OUTPUT:
2)GET REQUEST
COMMAND : curl https://www.khanacdemy.org/
OUTPUT:
3 ) PUT REQUEST
COMMAND : curl -X PUT https://en.wikipedia.org/put/ -d "PUT
request data"
OUTPUT :
4)POST REQUEST
COMMAND:curl -X POST https://www.wikipedia.org/
SCREENSHOT:
5)DELETE REQUEST
COMMAND: curl -X DELETE http://espn.com/sample/delete/json?
id=1
SCREENSHOT:
6)TRACE REQUEST
COMMAND: curl --trace - https://amazon.net
SCREENSHOT:
7)CONNECT REQUEST
COMMAND:
curl -X proxy.Khanacademy.org:80 https://Khanacademy.org/
SCREENSHOT:
8) OPTIONS REQUEST
COMMAND: curl https://api.amazon.com/v1/requests -X OPTIONS
SCREENSHOT:
LIMIT MAXIMUM TRANSFER RATE:

COMMAND: curl --limit-rate 1m -O
https://dl.google.com/go/go1.10.3.linux-amd64.tar.gzCo
OUTPUT:
DOWNLOAD FILE USING CURL:

COMMAND:
curl -O http://mirrors.edge.kernel.org/archlinux/iso/2018.06.01/archlinux-
2018.06.01-x86_64.iso \ -O
https://cdimage.debian.org/debian-cd/current/amd64/iso-cd/debian-9.4.0-amd64-
netinst.isoCopyCopy
output:
QUESTION 3:
Design an appealing webpage for a local internet service provider to display the details
about his services and plans i.e., broad band, fiberto home, Internet TV.
Also design one web page for customer application form to subscribe a service or plan.
Connect both the pages. Use text formatting, image, form HTML and CSS elements .
CODE:
OUTPUT:
Homepage: code:
<!DOCTYPE html>
<html lang="en">
<head>
<title>A&ampA</title>
<link rel="stylesheet" href="../static/css/normalize.css">
<link rel="stylesheet" href="../static/css/grid.css">
<link href="https://fonts.googleapis.com/css?
family=Lato:100,300,300i,400,700" rel="stylesheet">
<link rel="stylesheet" href="../static/css/ionicons.min.css">
<link rel="stylesheet" href="../static/css/home.css">
<link rel="icon" href="../static/images/logo.jpg" type="image/jpg">
</head>
<body>
<header>
<nav class="row">
<img src="../static/images/brand.png" alt="A&A logo"
class="logo">
<ul class="main-nav">
<li>
<a href="{{url_for('careers')}}">Careers</a>
</li>
<li>
<a href="{{url_for('contact')}}">Contact</a>
</li>
<li>
<a href="{{url_for('login')}}">Login</a>
</li>
<li>
<a href="{{url_for('plans_info')}}">Plans</a>
</li>
<li>
<a href="{{url_for('about')}}">About</a>
</li>
<li>
<a href="{{url_for('home')}}">Home</a>
</li>
</ul>
</nav>
<div class="hero-text-box">
<h1>Fastest Network.
<br>We have more than 1000 Customers.</h1>
<a class="btn btn-full" href="{{url_for('login')}}">Login</a>
<a class="btn btn-full" href="{{url_for('contact')}}">New User?
</a>
</div>
</header>
<footer class="footer-section">
<div class="row">
<div class="col span-1-of-2">
<ul class="footer-nav">
<li >
<a href="{{url_for('home')}}">Home</a>
</li>
<li>
<a href="{{url_for('about')}}">About</a>
</li>
<li>
<a href="{{url_for('plans_info')}}">Plans</a>
</li>
<li>
<a href="{{url_for('login')}}">Login</a>
</li>
<li>
<a href="{{url_for('contact')}}">Contact</a>
</li>
<li>
<a href="{{url_for('careers')}}">Careers</a>
</li>
</ul>
</div>
<div class="col span-1-of-2 ">
<ul class="social-links">
<li>
<a href="#"><i class="ion-social-facebook"></i></a>
</li>
<li>
<a href="#"><i class="ion-social-instagram"></i></a>
</li>
</ul>
</div>
</div>
<div class="row">
<p class="footer-copy-text">2020 © A&ampA. All rights

reserved<br>Akshay Kumar Dhage and Ashish MJ</p>
</div>

</footer>

</body>

</html>
OUTPUT SCREENSHOT:
PLANS PAGE CODE:

{% extends 'template.html'%}
{%block head%}
<link rel="stylesheet" href="../static/css/plan.css">
{%endblock%}
{%block content%}
<section class="section-plans">
<div class="box">
<h1>Our Amazing Plans</h1>
</div>
<div class="row">
<div class="plan-box">
<div>
<h3>Basic</h3>
<p class="plan-price">&#8377 599
<span>/ month</span>
</p>
</div>
<div>
<ul>
<li>
<i class="ion-flash ion-small"></i>10 Mbps
Speed</li>
<li>
<i class="ion-wifi ion-small"></i>250 GB
Broadband data</li>
<li>
<i class="ion-speedometer ion-small"></i>512
Kbps Post FUP Speed</li>
</ul>
</div>
</div>
</div>
<div>
<h3>Premium</h3>
</p>
</div>
<div>
<ul>
<li>
Speed</li>
<li>
Broadband data</li>
<li>
Mbps Post FUP Speed</li>
</ul>
</div>
</div>
</div>
<div>
<h3>Elite</h3>
</p>
</div>
<div>
<ul>
<li>
Speed</li>
<li>
Broadband data</li>
<li>
Mbps Post FUP Speed</li>
</ul>
</div>
</div>
</div>
</div>
</section>
{%endblock%}
PLANS PAGE SCREENSHOT:
EXTERNAL CSS FILES CODES:

HOME PAGE STYLE SHEET:
*{
margin: 0;
padding: 0;
box-sizing: border-box;
}
.row{
margin: 0 auto;
max-width: 1140px;
}
h1{
margin: 0;
color: #fff;
font-size: 240%;
font-weight: 300;
word-spacing: 3px;
letter-spacing: 1px;
text-transform: uppercase;
margin-bottom: 20px;
}
html{
background-color: #fff;
color: #555;
font-family: 'Lato', 'Arial' ,sans-serif;
font-weight: 300;
font-size: 20px;
text-rendering: optimizeLegibility;

}
/*home page */
header{
background-image:linear-gradient(rgba(0, 0, 0, 0.7),rgba(0, 0, 0,
0.7)),url(../images/back.jpg);
background-size: cover;
background-position: center;
height: 100vh;
}
.hero-text-box{
position: absolute;
width: 1140px;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
margin-top: 40px;
}
.logo{
height: 100px;
width: auto;
float: left;
margin-top: 20px;
border-radius: 50%
}
.main-nav li{
float: right;
list-style: none;
margin-left: 40px;
margin-top: 55px;
: black
}
.main-nav li a:link,
.main-nav li a:visited{
text-decoration: none;
color: #fff;
text-transform: uppercase;
font-size: 90%;
padding: 8px 0;
}
.main-nav li a:hover,
.main-nav li a:active{
border-bottom: 2px solid #e67e22;
transition: .1s;
}

.btn:link,
.btn:visited,
input[type=submit]{
display: inline-block;
padding: 10px 30px;
font-weight: 300;
border-radius: 200px;
transition: background-color 0.2s,border 0.2s,color 0.2;
}
.btn-full:link,
.btn-full:visited,
input[type=submit]{
background-color: #e67e22;
border: 1px solid #e67e22;
color: #fff;
margin-right: 25px
}
.btn:hover,
.btn:active,
input[type=submit]:hover,
input[type=submit]:active{
background-color: #c16d17;
}
.btn-full:hover,
.btn-full:active{
border: 1px solid #c16d17;
}
/*******Footer*********************************/
footer{
background-color: #333;
padding: 5px;
font-size: 80%;
}
.footer-nav {
list-style: none;
float: left;
}
.social-links{
list-style: none;
float: right;
}
.footer-nav li,
.social-links li{
display: inline-block;
margin-right: 20px;
}
.footer-nav li:last-child,
.social-links li:last-child{
margin-right: 0;
}
.social-links li a:link,
.social-links li a:visited,
.footer-nav li a:link,
.footer-nav li a:visited{
color: #888;
border: 0;
transition: color 0.2s;
}
.footer-nav li a:hover,
.footer-nav li a:active{
color: #ddd;
}
footer p{
color: #888;
text-align: center;
margin-top: 5px;
}
.social-links li a:link,
.social-links li a:visited{
font-size: 160%
}
.ion-social-facebook,
.ion-social-instagram{
transition: color 0.2s;
}
.ion-social-facebook:hover{
color:#3b5998;
}
.ion-social-instagram:hover{
color: #e1306c;
}
PLANS PAGE CSS STYLESHEET:

.section-plans{
background-color: #f1f1f1;
height: 100vh;
}
.plan-box{
background-color: #fff;
border-radius : 5px;
width: 90%;
margin-left: 5%;
}
.plan-box div{
padding: 15px;
border-bottom: 1px solid #e8e8e8;
}
.plan-price{
font-size: 300%;
margin-bottom: 10px;
font-weight: 100;
color: #e67e22;
}
.plan-price span{
font-size: 30%;
font-weight: 300;
}
.plan-box ul{
list-style: none;
}
.plan-box ul li{
padding: 10px 0;
}
.ion-small{
color: #e67e22;
font-size: 30px;
padding-right: 10px;
}
.section-plans .row{
padding: 20px;
padding-bottom: 50px;
}
.section-plans .box{
padding-left: 200px;
padding-right: 200px;
padding-top: 1px;
}
.section-plans .box h1{
text-align: center;
color:black;
font-size: 250%;
padding-top: 20px;
padding-bottom: 20px;
border-bottom: 2px solid #e67e22;
}

20BCE2114

Uploaded by

Document Information

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

20BCE2114

Uploaded by

Copyright:

Available Formats

NAME  MAYANK YADAV

SUBMITTED TO-- SUBMITTED BY--

1. IDE – Netbeans – Explore the features of netbeans for webpage development

<h1 align="center">DIGITAL ASSIGNMENT</h1>

LIMIT MAXIMUM TRANSFER RATE:

DOWNLOAD FILE USING CURL:

<p class="footer-copy-text">2020 © A&ampA. All rights

PLANS PAGE CODE:

PLANS PAGE SCREENSHOT:

EXTERNAL CSS FILES CODES:

PLANS PAGE CSS STYLESHEET:

You might also like

20BCE2114

Uploaded by

Document Information

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

20BCE2114

Uploaded by

Copyright:

Available Formats

NAME  MAYANK YADAV

SUBMITTED TO-- SUBMITTED BY--

1. IDE – Netbeans – Explore the features of netbeans for webpage development

<h1 align="center">DIGITAL ASSIGNMENT</h1>

LIMIT MAXIMUM TRANSFER RATE:

DOWNLOAD FILE USING CURL:

<p class="footer-copy-text">2020 &copy; A&ampA. All rights

PLANS PAGE CODE:

PLANS PAGE SCREENSHOT:

EXTERNAL CSS FILES CODES:

PLANS PAGE CSS STYLESHEET:

You might also like

<p class="footer-copy-text">2020 © A&ampA. All rights