Programming and Codes

Sunday, 22 September 2019

My First HTML website.

Hi! friends,

I'm Deepak Sharma 26,well it's my first HTML website which I have created of my own.It took me so much time to code it ,because it was so lengthy to write different pages of same kind of purpose containing different contents.And link them to each other.

Well,this website is about Tour & Travels by me. It consists of different pages like booking, home, contact etc.Well It's not a proper website you see on internet, it's just a full working layout.

Let's see the First page,

Home

<!DOCTYPE html>

<html>

<style>

.sidenav {

display: none;

height: 100%;

width: 190px;

position: fixed;

z-index: 1;

top: 0;

left: 0;

background-color: #111;

overflow-x: hidden;

padding-top: 60px;

}

.sidenav a {

padding: 8px 8px 8px 3px;

text-decoration: none;

font-size: 25px;

color: #818181;

display: block;

}

.sidenav a:hover {

color: #f1f1f1;

}

.sidenav .closebtn {

position: absolute;

top: 0;

right: 25px;

font-size: 36px;

margin-left: 50px;

}

@media screen and (max-height: 450px) {

.sidenav {padding-top: 15px;}

.sidenav a {font-size: 18px;}

}

header {

background-color:red;

color:white;

text-align:center;

padding:5px;

}

nav {

line-height:30px;

background-color:grey;

height:480px;

width:100px;

float:left;

padding:5px;

}

section {

width:450px;

float:left;

padding:10px;

margin-left:10px;

height:470px;

}

footer {

background-color:black;

color:white;

clear:both;

text-align:center;

padding:5px;

}

ul {

list-style-type: none;

margin: 0;

padding: 0;

overflow: hidden;

background-color: #333;;

}

li {

float: right;

}

li a {

display: block;

color: white;

text-align: center;

padding: 14px 16px;

text-decoration: none;

}

li a:hover:not(.active) {

background-color: #111;

}

.active {

background-color: #4CAF50;

}

</style>

</head>

<body>

<a href="#" style="text-decoration:none;">Payment</a>

<a href="#" style="text-decoration:none;">Services</a>

<a href="#" style="text-decoration:none;">Clients</a>

</div>

<h1>

<font style="margin-left:105px;margin-right:55px;"> Deepak's Tours & Travels</font></h1>

</header>

function openNav() {

document.getElementById("mySidenav").style.display = "block";

}

function closeNav() {

document.getElementById("mySidenav").style.display = "none";

}

</script>

<ul>

<li><a href="content://com.mi.android.globalFileexplorer.myprovider/external_files/Contact.html" >Contact</a></li>

<li><a href="content://com.mi.android.globalFileexplorer.myprovider/external_files/About%20us.html" >About us</a></li>

<li><a href="content://com.mi.android.globalFileexplorer.myprovider/external_files/Booking.html" >Booking</a></li>

</ul>

<nav>

Deepak Sharma 26 is the best of all.

</nav>

<center><h2><u>Search Your Dream Place</u></h2></center>

<fieldset style="width:450px;"><legend><h4>Top Trending Places</h4></legend>

</marquee>

</fieldset>

</section>

</footer>

</body>

</html>

The output of this page is,

The second page,

Booking

<!DOCTYPE html>

<html>

<style>

.sidenav {

display: none;

height: 100%;

width: 190px;

position: fixed;

z-index: 1;

top: 0;

left: 0;

background-color: #111;

overflow-x: hidden;

padding-top: 60px;

}

.sidenav a {

padding: 8px 8px 8px 3px;

text-decoration: none;

font-size: 25px;

color: #818181;

display: block;

}

.sidenav a:hover {

color: #f1f1f1;

}

.sidenav .closebtn {

position: absolute;

top: 0;

right: 25px;

font-size: 36px;

margin-left: 50px;

}

@media screen and (max-height: 450px) {

.sidenav {padding-top: 15px;}

.sidenav a {font-size: 18px;}

}

header {

background-color:red;

color:white;

text-align:center;

padding:5px;

}

nav {

line-height:30px;

background-color:grey;

height:580px;

width:100px;

float:left;

padding:5px;

}

section {

width:420px;

float:left;

padding:10px;

margin-left:50px;

height:570px;

}

footer {

background-color:black;

color:white;

clear:both;

text-align:center;

padding:5px;

}

ul {

list-style-type: none;

margin: 0;

padding: 0;

overflow: hidden;

background-color: #333;;

}

li {

float: right;

}

li a {

display: block;

color: white;

text-align: center;

padding: 14px 16px;

text-decoration: none;

}

li a:hover:not(.active) {

background-color: #111;

}

.active {

background-color: #4CAF50;

}

</style>

</head>

<body>

<a href="#" style="text-decoration:none;">Payment</a>

<a href="#" style="text-decoration:none;">Services</a>

<a href="#" style="text-decoration:none;">Clients</a>

</div>

<h1>

<font style="margin-left:105px;margin-right:55px;"> Deepak's Tours & Travels</font></h1>

</header>

function openNav() {

document.getElementById("mySidenav").style.display = "block";

}

function closeNav() {

document.getElementById("mySidenav").style.display = "none";

}

</script>

<ul>

<li><a href="content://com.mi.android.globalFileexplorer.myprovider/external_files/Contact.html" >Contact</a></li>

<li><a href="content://com.mi.android.globalFileexplorer.myprovider/external_files/About%20us.html" >About us</a></li>

<li><a class="active" href="#" >Booking</a></li>

</ul>

<nav>

Deepak Sharma 26 is the best of all.

</nav>

<center><h2><u>Enter your details.</u></h2></center>

<br><b>Your total payable amount: </b><input type="number" value="10000" style="border-radius:5px;width:90px"><br><br>

<b>Pay your payment by: </b><input type="text" style="border-radius:5px; " >

</section>

</footer>

</body>

</html>

which again consists a another page,

Input details

<html>

<head><title>Input Details.</title></head>

<b>First Name:</b><input type="text" placeholder="First Name" style="background-color:skyblue; border-radius:5px;" autofocus><br><br>

<b>Email Id:</b><input type="email" placeholder="Email id" style="background-color:burlywood; border-radius:5px;"><br><br>

<b>Phone No.</b><input type="tel" placeholder="Enter Phone no." maxlength="10" style="border-radius:5px; background-color:burlywood"><br><br>

<b>Address:</b><input type="text" placeholder="Address" style="background-color:burlywood; border-radius:5px;"><br><br>

<center><h3>No. of Members:</center></h3>

<b>No. of Rooms</b><input type="number" placeholder="No. of Rooms" style="background-color:lightblue;border-radius:5px; width:145px; margin-left:20px;"><br><br>

<b>No. of Days for holiday:</b><input type="number" placeholder="Days" style="background-color:lightblue;border-radius:5px; width:110px; margin-left:10px;"><br><br>

<b>Date of Arrival:</b><input type="date" placeholder="Date of Arrival " style="background-color:lightgreen; border-radius:5px; margin-left:55px;"><br><br>

<b>Place of Arrival:</b><input type="text" placeholder="Place of Arrival" style="background-color:lightgreen; border-radius:5px; margin-left:25px;"><br><br>

<b>Place to Travel:</b><input type="text" placeholder="Place to travel" style="background-color: lightgreen; border-radius:5px; margin-left:35px;"><br><br>

<b>Transportation:</b><input list="vehicle" name="vehicle" placeholder="Choose your vehicle" style="border-radius:5px;background-color:lightgreen;margin-left:20px;"><datalist id="vehicle">

</datalist>

</form>

</body>

</html>

The output is,

The third page is,

About us

<!DOCTYPE html>

<html>

<style>

.sidenav {

display: none;

height: 100%;

width: 190px;

position: fixed;

z-index: 1;

top: 0;

left: 0;

background-color: #111;

overflow-x: hidden;

padding-top: 60px;

}

.sidenav a {

padding: 8px 8px 8px 3px;

text-decoration: none;

font-size: 25px;

color: #818181;

display: block;

}

.sidenav a:hover {

color: #f1f1f1;

}

.sidenav .closebtn {

position: absolute;

top: 0;

right: 25px;

font-size: 36px;

margin-left: 50px;

}

@media screen and (max-height: 450px) {

.sidenav {padding-top: 15px;}

.sidenav a {font-size: 18px;}

}

header {

background-color:red;

color:white;

text-align:center;

padding:5px;

}

nav {

line-height:30px;

background-color:grey;

height:419px;

width:100px;

float:left;

padding:5px;

}

section {

width:507px;

float:left;

padding:1px;

margin-left:5px;

height:427px;

}

footer {

background-color:black;

color:white;

clear:both;

text-align:center;

padding:5px;

}

ul {

list-style-type: none;

margin: 0;

padding: 0;

overflow: hidden;

background-color: #333;;

}

li {

float: right;

}

li a {

display: block;

color: white;

text-align: center;

padding: 14px 16px;

text-decoration: none;

}

li a:hover:not(.active) {

background-color: #111;

}

.active {

background-color: #4CAF50;

}

</style>

</head>

<body>

<a href="#" style="text-decoration:none;">Payment</a>

<a href="#" style="text-decoration:none;">Services</a>

<a href="#" style="text-decoration:none;">Clients</a>

</div>

<h1>

<font style="margin-left:105px;margin-right:55px;"> Deepak's Tours & Travels</font></h1>

</header>

function openNav() {

document.getElementById("mySidenav").style.display = "block";

}

function closeNav() {

document.getElementById("mySidenav").style.display = "none";

}

</script>

<ul>

<li><a href="content://com.mi.android.globalFileexplorer.myprovider/external_files/Contact.html" >Contact</a></li>

<li><a class="active" >About us</a></li>

<li><a href="content://com.mi.android.globalFileexplorer.myprovider/external_files/Booking.html" >Booking</a></li>

</ul>

<nav>

Deepak Sharma 26 is the best of all.

</nav>

<center><h1>About Us</h1></center>

<center><del><pre> </pre></del><h3>Our Story</h3><del><pre> </pre></del></center>

<center style="padding:10px;">Just over a year ago, we became fascinated by the ideas of

discovering the worldthrough someone else's eyes.What if you could

see through the eyes of a protestor in Ukraine? Or watch a sunrise from a hot air

ballon in Cappadocia? It may sound crazy.but we wanted to build

the closest thing to teleportaion.While there are many ways to discover events and

places, we realized there is no such a better way to experience a place right now

than to be there.A picture may be worth of a thousand words,but the feeling can

take you someplace and show you around.</center>

</section>

</footer>

</body>

</html>

The output is,

The fourth page is,

Contact

<!DOCTYPE html>

<html>

<style>

.sidenav {

display: none;

height: 100%;

width: 190px;

position: fixed;

z-index: 1;

top: 0;

left: 0;

background-color: #111;

overflow-x: hidden;

padding-top: 60px;

}

.sidenav a {

padding: 8px 8px 8px 3px;

text-decoration: none;

font-size: 25px;

color: #818181;

display: block;

}

.sidenav a:hover {

color: #f1f1f1;

}

.sidenav .closebtn {

position: absolute;

top: 0;

right: 25px;

font-size: 36px;

margin-left: 50px;

}

@media screen and (max-height: 450px) {

.sidenav {padding-top: 15px;}

.sidenav a {font-size: 18px;}

}

header {

background-color:red;

color:white;

text-align:center;

padding:5px;

}

nav {

line-height:30px;

background-color:grey;

height:465px;

width:100px;

float:left;

padding:5px;

}

section {

width:497px;

float:left;

padding:5px;

margin-left:7px;

height:465px;

}

footer {

background-color:black;

color:white;

clear:both;

text-align:center;

padding:5px;

}

ul {

list-style-type: none;

margin: 0;

padding: 0;

overflow: hidden;

background-color: #333;;

}

li {

float: right;

}

li a {

display: block;

color: white;

text-align: center;

padding: 14px 16px;

text-decoration: none;

}

li a:hover:not(.active) {

background-color: #111;

}

.active {

background-color: #4CAF50;

}

</style>

</head>

<body>

<a href="#" style="text-decoration:none;">Payment</a>

<a href="#" style="text-decoration:none;">Services</a>

<a href="#" style="text-decoration:none;">Clients</a>

</div>

<h1>

<font style="margin-left:105px;margin-right:55px;"> Deepak's Tours & Travels</font></h1>

</header>

function openNav() {

document.getElementById("mySidenav").style.display = "block";

}

function closeNav() {

document.getElementById("mySidenav").style.display = "none";

}

</script>

<ul>

<li><a class="active">Contact</a></li>

<li><a href="content://com.mi.android.globalFileexplorer.myprovider/external_files/About%20us.html" >About us</a></li>

<li><a href="content://com.mi.android.globalFileexplorer.myprovider/external_files/Booking.html" >Booking</a></li>

</ul>

<nav>

Deepak Sharma 26 is the best of all.

</nav>

<center><h2>Welcome!</h2></center>

Welcome to my first webpage.I created this webpage without the assistance of webpage editor.Just my little text editor and

a keen understanding of html.

<p>Look around.Notice I'm able to use paragraphs,lists and headings.You may not be able to tell,but the layout is by myself.

I'm very clever.</p>

<p style="margin-left:80px;">I always wanted to be somebody, but now I realize I should have been more specific.

<br><br><i>Deepak Sharma 26</i></p>

<i>Deepak Sharma<br>

Student(IICS)<br>

522.5445.5445<br>

Contact me at <u><a href="#" >deepaksharma26.@gmail.com</a></u>

</i>

</section>

</footer>

</body>

</html>

The output is,

Well guys this is all about , my first website.

Now Check it out on Internet for real :

My Website .

Some Format tags.

Hi! friends,

This is Deepak Sharma 26 with all of you.

Well today I wanna share something about my class. Our teacher taught us some tags about "text formatting". but I already did it in my home so, I was thinking that there is no need to take this class but after attending the class, I realized that I didn't got all the tags in home.I was lucky that I didn't miss this class.

Let's check out the tags,

<html>

<head>

</head>

<body>

<p>

<b>Write Your First Paragraph in bold text.</b><br><br>

<strong>This is an important content</strong><br><br>

<em>This is an important content</em><br><br>

<u>Write Your First Paragraph in underlined text.</u><br><br>

<strike>Write Your First Paragraph with strikethrough</strike><br><br>

Hello <tt>Write Your First Paragraph in monospaced font.</tt><br><br>

Hello <sup>Write Your First Paragraph in superscript.<br><br>

Hello <sub>Write Your First Paragraph in subscript.</sub><br><br>

Hello <del>Delete your first paragraph.</del><br><br>

<del>Delete your first paragraph.</del><ins>Write another paragraph.</ins><br><br>

Hello <big>Write the paragraph in larger font.</big><br>

</p>

</body>

</html>

The output of this code is,

Friday, 20 September 2019

OSI(open system interconnection) Model.

Hi! friends,

This is Deepak Sharma 26 with you all and today I wanna share about an interesting fact about "Communication Protocol".As you know in today's life communication can be done by anywhere and by anything like mobile, telephone, computer etc. But in previous time there was not such facility by which communication can be done easily.

And you know that how this is important for us.

Let's discuss about it,

OSI Model

The OSI model was developed to standardized the procedure for exchange information between processing system.The OSI is a communication reference model that has been defined by international standards organisation (ISO).It is a seven layer communication protocol intended as a standard for the development of communication system world wide.

Before OSI model, the computers with different software capabilities(Operating system) , cannot communicate with each other.For example:-Windows NT, machine running with TCP/IP protocol, cannot communicate with a IBM A5400 machine and also running on TCP cannot communicate with each other.

Most vendors and suppliers of computer communication equipment have agreed to support OSI in one form or another. Accessibility to this standard is vital in order to achieve smooth universal communication. The seven layer of OSI model provides a way for you to understand how communication take place.

Here, you can see a physical diagram of it,

For now that's it , later we will discuss it's all seven layers.

Thursday, 19 September 2019

Internet Network.

Hi! friends,

This is Deepak Sharma 26,from India.Today I'm very excited to share about my class in IICS. Well today I have learned some theoretical facts about "Network".

So, let's discuss about that things what I have learned from my class,

Network:

A computer network is simply a group of computers that are so connected that resources can be exchanged.The typical computer network consists of more than one computer and associated peripherals.

In a network computer of different configurations can also be connected together and users can work together in a group.Network can also be created without cabling which is called wireless networking.

Need of Networking :

1.) Resource sharing :

The aim to make all programs, data and

peripherals and available to authorized

users on the network without worry of

the physical location of the resources.

2.) Reliability :

Reliability is provided by having an

alternative source of data and

resources available for use.

3.) Financial benefits :

Networking is financially very

beneficial for data transmission

than any other modes of transmition.

4.) Access to remote Database :

By getting access to remote Database,

it is possible to get rid of unnecessary

trouble and wastage of precious time

especially in works of reservations.

Here you can see a physical implementation of network in our daily lives,

So,That's all I got to know about internet.

Monday, 16 September 2019

Star Topology.

Hello! friends,

I'm Deepak Sharma 26,today I'm very excited to share this post to all. Basically It is about a type of Topology, which I have started in this blog recently.Well today we gonna discuss about "Star Topology".

So, let's start the topic,

3) Star Topology

In this each computer (node) or peripheral on a star network communicate with a central hub/switch that resends the message either to one computer (switch) or all computers (hub/switch).

Let's see the working model of star topology,

Here you are seeing that each computer, printer,CPU, Internet are connected to "Switch", which is basically designed to connect different-different system to each other providing them full access to each other.

Let's see the working of "Switch",

Here,you are seeing the switch which can be connect to other systems or other switch to increase the size of network.

Some Benefits of Star Topology:

1. It is easier to modify or add new computers to the network without disturbing rest of the network.

2. It is very easy to checkout the defects in the network.

3. It is easy to increase the size of network.

4. You can also use several types of cable in the same network.

Some drawbacks of star topology:

1. Failure of central device may result into the failure of network.

Thank you and Good wishes to all.

Saturday, 14 September 2019

Types of Topology.

Hi! friends,

This is Deepak Sharma 26, who is presenting himself in before you all.Today I wanna discuss about some remaining topics which we have started in previous post.

Let's start the discussion,

Now the second type of Topology,

2.Ring Topology.

This type of layout is similar to the Bus Topology, except that the nodes are connected in a circle using a segment.

In this layout each node is connected to the only two other nodes.Each node passes information along to the next until it arrives at its intended destination.

Some Benefits over Bus Topology:

In this, the signal is not lost due to absorbing by terminator and each time the signal is resend to the receiving computer by each node(computer) until it finds its destination.

Some drawbacks of Ring Topology:

1.The installation is hard than others, due to each node is connected to two other node.

2.When a new node is added to the segment then it is hard to set new maps.

Let's see a figure of it,

Later we will discuss other remaining topics, That's it.

Good wishes to all.🤗

Hoverable Buttons.

Hi! friends,

I'm Deepak Sharma 26, well now it is evening and today I wanna tell you something special about the buttons in HTML.

As you know wherever we see in websites, webpages etc. There are some buttons are used, which changes it's color when cursor is moved on it.

Let's see how it works,

<!DOCTYPE html>

<html>

<head>

<style>

.button {

background-color: #4CAF50; /* Green */

border: none;

color: white;

padding: 16px 32px;

text-align: center;

text-decoration: none;

display: inline blocks;

font-size: 16px;

margin: 4px 2px;

-webkit-transition-duration: 0.4s; /* Safari */

transition-duration: 0.4s;

cursor: pointer;

}

.button1 {

background-color: white;

color: black;

border: 2px solid #4CAF50;

}

.button1:hover {

background-color: #4CAF50;

color: white;

}

.button2 {

background-color: white;

color: black;

border: 2px solid #008CBA;

}

.button2:hover {

background-color: #008CBA;

color: white;

}

.button3 {

background-color: white;

color: black;

border: 2px solid #f44336;

}

.button3:hover {

background-color: #f44336;

color: white;

}

.button4 {

background-color: white;

color: black;

border: 2px solid #e7e7e7;

}

.button4:hover {background-color: #e7e7e7;}

.button5 {

background-color: white;

color: black;

border: 2px solid #555555;

}

.button5:hover {

background-color: #555555;

color: white;

}

</style>

</head>

<body>

<h2>Hoverable Buttons</h2>

<p>Use the :hover selector to change the style of the button when you move the mouse over it.</p>

<p><strong>Tip:</strong> Use the transition-duration property to determine the speed of the "hover" effect:</p>

<button class="button button1">Green</button>

<button class="button button5">Black</button>

</body>

</html>

You can also see the output here,

You can also try it, yourself.

Good wishes to all.

Friday, 13 September 2019

Network Topology.

Hi! friends,

I'm Deepak Sharma 26 ,today I'm very happy to share some views on an interesting topic of Network.Well as you know that a network contains so many things to discuss.

So today I'm gonna start my topic on

"Topology".

Topology:

Topology is the method in which networks are physically connected.It determines the complexity of connecting computers and the cost of cable installation.Cable installation can often be a major cost factor for network system.(In my terms,It is the way of arranging the different systems to connect to each other.)

Topology determines the strategy for physically expending the network in future.There are several types of topologies that defines a network:

1. Bus Topology:

It's a simplest type of Topology, which is usually used in LAN(local area network).In this all computers are connected by a single length of cable with a terminator at each end.This topology is often found in "Client-Server" network.At each end of wire terminator is used to absorb unwanted signals. Transmitted data can only received by whom it send to.

They have also some drawbacks:

1.Only one computer can communicate at a time.
2.A computer must wait until the bus is free before it can transmits.
3.If the receiving computer is not available at the time of transmition then after some time,signal will lost.

Let's see a figure of it,

Later, we will discuss other remaining topics.
That's it.

Sunday, 8 September 2019

Login page.

Hi! friends,

I'm Deepak Sharma 26, today I'm very excited because my father rewarded me with a very special gift that I have never ever thought about it.

Well, today I'm gonna share about what I have got to learn. As usual in sunday there was no class in IICS.But I got to learn by my self by an abb in android phone which is called W3SCHOOLS.

Let's see what I have learned today,

<html>

<head>

<title>Facebook login page</title>

</head>

<body>

<b>Facebook</b></font></center></p>

<form>

<input type="text" placeholder="User Name"

style="height:20px;padding-left:10px; width:150px;border-radius:5px;">

<label style="color: white; ">Password:</label>

<input type="password" placeholder="Password"

style="height:20px; width:150px; padding-left:10px; border-radius:5px;">

</center>

</form>

</td>

</tr>

</td>

<td width=60%><center><h3><u>Create New Account</u></h3></center>

<b>First Name:</b>

<br><br><b>Gender:</b>

Male<input type="radio" name="g">

Female<input type="radio" name="g">

<label style="margin-left:58px;">Other</label><input type="radio" name="g">

<b>Email Id:</b><input type="email" placeholder="Email Id" style="width:133px; border-radius:5px;"><br><br>

<b>Password:</b><input type="password" placeholder="Password" style="border-radius:5px;width:120px;"><br><br>

<input type="submit" value="Create New Account"

style="border-radius:5px; background-color:blue; color: white; font-size:19px; height:45px;">

</center>

</td>

</tr>

</table>

</body>

</html>

The output of this html code is,

You should try this by yourself also,

best of luck to all.

Friday, 6 September 2019

Edit Profile.

Hi ! friends,

This is Deepak Sharma 26, today I'm very excited to share about my today's class in IICS.

Well,In IICS, today my teacher Kedar was not present due to some technical issues in IICS,so today's class was taught by some other teacher named Aman.

He taught us very well and professionally.
He was very nice and has a good knowledge of HTML coding. He taught us new element, function of HTML.

Which I have used in this code,
let's see the code,

<html>
<head>
<title>Etit profile</title>
<style>
#form1{ border:1px solid #666;
padding:10px; border-radius:25px;}
</style>
</head>
<body style="background-color: yellow;"><center><h1>Edit Profile</h1></center>
<form id="form1">
<p>
<label style="color:#666;font-weight:bold;
font-family: Arial black;">
First Name:
</label>
<input type="text" placeholder="First Name"
style="border:1px solid #999; border-radius:10px;
padding-left:10px; height:25px;">
</p>
<br>
<p>
<label style="color:#666; font-weight:bold;
font-family: Arial black;">
Last Name:
</label>
<input type="text" placeholder="Last Name"
style="border:1px solid #999; border-radius:10px;
padding-left:10px; height:25px;">
</p>
<br>
<p>
<label style="color:#666; font-weight:bold;
font-family: Arial black;">
Gender:
</label>
<input type="radio" name="Gender">
<font style="color:#666; font-weight:bold;
font-family: Arial black;">MALE</font>
<input type="radio" name="Gender">
<font style="color:#666; font-weight:bold;
font-family: Arial black;">FEMALE</font>
<input type="radio" name="Gender">
<font style="color:#666; font-weight:bold;
font-family: Arial black;">OTHERS</font>
</p>
<br>
<p>
<label style="color:#666; font-weight:bold;
font-family: Arial black;">
Date of birth:
</label>
<input type="Date" placeholder="DOB"
style="border:1px solid #999; border-radius:10px;
padding-left:10px; height:25px;">
</p>
<br>
<p>
<label style="color:#666; font-weight:bold;
font-family: Arial black;" >
Email Id:
</label>
<input type="email" placeholder="Enter Email Id"
style="border:1px eolid #999; border-radius:10px;
padding-left:10px; height:25px;">
</p>
<br>
<p>
<label style="color:#666; font-weight:bold;
font-family:Arial black;">
Password:
</label>
<input type="password" placeholder="Enter password"
style="border:1px solid #999; border-radius:10px;
padding-left:10px; height:25px;">
</p>
<input type="reset" value="Clear" style="background-color:red;
border-radius:10px; color:#fff; height:25px;">
<input type="button" value="Sign up" style="background-color:green; border: none;
margin-left:200px; border-radius:10px; height:25px; color:#fff;" >

</form>
</body>
</html>

The output of this code is:

You can also try this code by yourself, Good luck to all.

Thursday, 5 September 2019

HTML element Marquee.

Hi ! friends,

I'm Deepak Sharma, I'm very excited to share what I have learned today about an element of HTML coding.

In morning,I was thinking to stay in home due to fever. But I went to my class in IICS(Indian institute of computer science).

And I got to learn about a very wonderful element of HTML,which is called "Marquee".

Let's see the code,what I have got to know about Marquee,

<html>

<head>

<title>Marquee</title>

</head>

<body>

<marquee><h1>Deepak Sharma 26</h1>

</marquee>

<marquee direction="right">Deepakcodes,you can also use down, left, up.

</marquee>

<marquee scrollamount=20>Deepakcodes

</marquee>

<marquee width=150 height=50>deepakcodes

</marquee>

<marquee behavior="alternate">you can also use scroll, slide.

</marquee>

<marquee bgcolor="red">deepakcodes

</marquee>

<marquee hspace=20 vspace=20>Deepak Sharma 26

</marquee>

<br>

This is a function to stop,when you click on moving text and after clicking some where else it starts moving.

</marquee>

</body>

</html>

The output is:

You can also try it,yourself this is good brushup to your skills.

Wednesday, 4 September 2019

Satellite communication.

Hi ! friends,

This is Deepak Sharma 26, today I have learned about a communication mode, based upon microwave signals,which is called Satellite link.

As you know effective communication plays a vital role in success of management and projects. It bridges the gap between client and server.

The satellite transmits microwave signals between the parabolic antennas. The main antenna is on the satellite.

The satellite revolves around the earth, about 36000km above the equator in a orbit which is called " Geo-synchronous".

Tuesday, 3 September 2019

HTML text format tags.

Good evening!To all my friends,

My self Deepak Sharma 26, today I am gonna discuss about what I have learned today in my class.

So, today I have learned about

some tags of formats in HTML.

As you know there is need of some text designing in the website to make it more attractive or understandable.

Let's see what the code is,

<html>

<head>

<title>All text formats</title>

</head>

<body>

Element name Description<br>

<b> This is physical tag, which is used to bold the text written between it.</b>

<br>

<strong> This is a logical tag, which is tells the browser that the text is important.</strong>

<br>

<i> This is physical tag which is used to make text italic.</i>

<br>

<em> This is a logical tag which is used to display content in italic.</em>

<br>

<mark> This tag is used to highlight a text.</mark>

<br>

<u> This tag is used to underline text written between it.</u>

<br>

<tt> This tag is used to appear a text in teletype. (not supported in HTML5)</tt>

<br>

<strike> This tag is used to draw a strikethrough on a section of text. (Not supported in HTML5)</strike>

<br>

<sup> It display the content slightly above the normal line.</sup>

<br>

<sub> It display the content slightly below the normal line.</sub>

<br>

<del> This tag is used to display the deleted content.</del>

<br>

<ins> This tag display the content which is added</ins>

<br>

<big> This tag is used to increase the font size by one conventional unit.</big>

<br>

<small> This tag is used to decrease the font size by one unit from base font size.</small>

</body>

</html>

The description of all tags are given. Checkout the output of code of yourself.

Monday, 2 September 2019

Fiber optic cable.

Good morning! friends,

This is Deepak Sharma,today we will discuss about the fiber optic cable.

As you know in today's generation the mode of transmitting the data at the destination,is very important.
It also matters that how much data is flowing through the cable,and what it's speed, bandwidth etc.
It is the newest form of guided media,It transmits light signal rather than electrical signal. There are two types of sources of light:

1).LED(light emitting diode)
2).LASER(light amplifier by stimulated
emission radiation)

When you think about the fiber optic cable you imagine that there's only one glass rod in wire, but it's not true, in reality it has so many threads of transparent plastic.

Fiber optic cable

If you wanna see the arrangement of cable between the continents under water,Click on this, https://www.submarinecablemap.com

Sunday, 1 September 2019

HTML code for symbols.

Check out the output of this code you will be fascinate after looking the symbols and you can also try the other combinations of numbers.

Saturday, 31 August 2019

How to make application form using HTML.

Hi, friends!

This is Deepak Sharma, today I have learned about the application form in HTML.The code is easy to understand but

lengthy to write.

It is very useful in many fields as you know about that.

Let's see what the code is,

<head>

<title>Application form</title>

</head>

<body>

<center>Application form</center>

</font>

</h1>

<p><b>first name</b>

</p>

<br>

</p>

<br>

<p><b>Email address</b>

<input type="text" name="Email

address"/>

</p>

<br>

<input type="radio" name="Sex"

value="Male"/>Male

<input type="radio" name="Sex" value="Female"/>Female

</p>

<br>

<p><b>Hobbies</b>

<input type="checkbox" name="Hobbies" value="Painting"/>Painting

<input type="checkbox" name="Hobbies" value="Reading"/>Reading

</p>

<br>

Software engineering

</option>

<option value="Data entry">Data entry </option>

<option value="Doctor">Doctor</option>

</select>

</p>

<br>

<p><b>Introduction</b>

<textarea rows="6" cols="50" name= "Introduction">Write your text

</textarea>

</p>

<br>

</form>

</body>

</html>

The output is,

You can try it yourself,and checkout the output of the code.

Friday, 30 August 2019

Some tags of HTML.

Hello! friends,

There also some other tags in which you can try in your HTML code.

let's see what is the code,

<html>

<head>

<title>This is used to put links of other files or website.</title>

</head>

<body>

<br>

<i>This is italic tag,which is a text tag.</i>

<br>

<u>This is under line tag.</u>

<br>

<hr>

<h4>Display of href attribute.</h4>

<p>Below is the link of anchor tag, click the link and see the next page</p>

</body>

</html>

here,<a> tag is used to put links.

And some other tags are also is used in this code like,

<br>=for line break in HTML.

<hr>=for horizontal line in HTML.

You can try it of yourself, checkout the output of the code.

First HTML code.

Hi! friends,

Today, I have learned about HTML code.

The few things were explained to me.

Let's see what was this , here is the code of

HTML,

<html>

<head>
<title>The basic building blocks of HTML.
</title>

</head>

<body>

<h1>The building blocks.</h1>

<p>This is a paragraph tag.</p>

<p style='color:red'>The style is attribute of paragraph.</p>

</body>

</html>

This is the code, which you can try it yourself.And checkout the output.

Thursday, 29 August 2019

About Me#

Good evening!friends,

Well ,my self Deepak Sharma,I'm from Sangam Vihar,New Delhi, India.

But,I born in Bihar, India.

As I have discussed about my present

condition to all of you, so you have

lumb-sumb idea about me.

And there is so much things to share with you guys.

So now I'm 18,mostly interested in knowledgefull things to know. I also have interest in musics mostly of "Post Malone",

who is my favourite singer. But I listen music on my mind's mood so, sometimes I love those songs that is not in my dictionary of musics.

Besides the course which I'm doing,I am also doing my BSC program from IGNOU.

I love mathematics because there's nothing to learn about something,you have to just follow the pattern and logics.

Wednesday, 28 August 2019

My first post.

Hi,friends.

This is my first post on my blog.
I have recently passed 12th class from RPVV,lajpat nagar.

I had science stream,which was so knowledgefull to me.

Now,I'm pursuing my carrier as a software engineer.I'm a student of IICS,lajpat nagar.

In few months,I have learned IT tools which includes Ms-word,Ms-excel,Ms-powerpoint and Ms-access.

And now I am learning to code in HTML.