How to use HTML very easy
How to use HTML very easy, you want to make a website but you don't know the basic language HTML No problem you can make a website with coding just read this post carefully. The main feature of it's that you can add this codes to live, means when I open it it is locally hosted on my computer you can publish on the internet very easy I will write a post on it.Why it is easy to use HTML
because there are some codes are
What is the full form of HTML - hypertext markup language how to use this can be used in WordPress How to use HTML very easy
What is the extension of HTML
.htm or .html
<html>
<head>
<title>Page Title</title>
</head>
<body>
<h1>This is a Heading</h1>
<p>This is a paragraph.</p>
</body>
</html>
What will be the output:-
how to add background color, font color, font face etc.
this code is for background color
<body style="background-color:powderblue;">
<h1>This is a heading</h1>
<p>This is a paragraph.</p>
this code is for font color
<h1 style="color:blue;">This is a heading</h1>
<p style="color:red;">This is a paragraph.</p>
this code is for font face
<h1 style="font-family:verdana;">This is a heading</h1>
<p style="font-family:courier;">This is a paragraph.</p>
<html>
<head>
<title>Page Title</title>
</head>
<body style="background-color:powderblue;">
<h1 style="color:blue;">This is a heading</h1>
<p style="color:red;">This is a paragraph.</p>
<h1 style="font-family:verdana;">This is a heading</h1>
<p style="font-family:courier;">This is a paragraph.</p>
<p style="font-family:courier;">This is a paragraph.</p>
</body>
</html>
what will be the output
this code is important <a href="https://technologyshashwat.blogspot.com/"> My Website</a>
the output will be before visiting the link
how to add a image to html file
add this code
<img src="img_girl.jpg" alt="Girl in a jacket" width="500" height="600">
the output will be
.
how to add a gif to html file add this code
<img src="programming.gif" alt="Computer man" style="width:48px;height:48px;">
the output will be sorry
! you have to try by yourself
how to add Navigation Bar
how to add Navigation Bar
<!DOCTYPE html>
<html>
<head>
<style>
ul {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
background-color: #333;
}
li {
float: left;
}
li a {
display: block;
color: white;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}
li a:hover {
background-color: #111;
}
</style>
</head>
<body>
<ul>
<li><a class="active" href="#home">Home</a></li>
<li><a href="#news">News</a></li>
<li><a href="#contact">Contact</a></li>
<li><a href="#about">About</a></li>
</ul>
</body>
</html>
the output will be
