Basic HTML Tags used
12 Basic HTML Tags used: Today we will share elements that will be very useful for starting making any website using HTML. This will be very helpful for beginners. We are also thinking to start writing similar posts if our viewers want them. For any suggestions do comment down or contact us via email or contact page.
First, let’s talk about what is a tag? A tag is nothing but an element that has a predefined type or can be defined by the user also. These tags are a very powerful tool in HTML as they allow us to build different elements on our page. Such as an input box, a submit button, and many more. In the end, we will also share an example page code where all these codes are used.
1. <!DOCTYPE html>
Usually when we start our website code, we declare what is our document type, and how should any browser read it as. <!DOCTYPE html> declares that the particular document is nothing but a html file.
2. <html>
The element can be seen as a container in which all the page code is included. After declaring the document type, we start the HTML tag and between this, we write out code. Make sure all the HTML tags should be only between this tag.
3. <head>
The head tag is used to declare different values of our HTML page. Such as the document title, character set, styles, links & scripts. This is used to declare these values to allow the browser and search engines to understand the page.
4. <title>
Inside the head tag, we declare this title tag to give a title to our HTML page. This title is visible at the top of the browser window. Make sure to use the relevant title for your page.
5. <style>
If you are not using an external CSS file or want to declare your styling elements value within the HTML file, you can use this tag and within these, you can give your styling. Make sure to follow the similar format used in CSS.
6. <body>
Body tag as the name suggests is used to declare the elements of the HTML page. Within this tag, we can declare all the elements we want to be seen on our page such as navigation bar, images, footer, etc.
7. <div>
We use this tag to divide different blocks of elements so that we can have a container like a block within we can have the division-specific elements.
8. <a>
The tag is known as an anchor tag and we use this to create a hyperlink to link to another page, we get a clickable text which is incorporated with href to link to another page.
9. <br>
We use this tag to put the next tag after this to appear on the next line. By this, our content gets a line break and appears good on a page.
10. <h1> <h2> <h3> <h4> <h5> <h6>
The h tag from <h1> to <h6> is used to give the heading or sub-heading in the page, and as the number increases from 1 to 6, the size of the heading keeps on decreasing.
11. <p>
We can add a paragraph of content within this tag. When we use this tag, the browser gives a default line break from the content before and after.
12. <img>
We can add an image using this tag on our page. When we use this tag, the image is embedded in our page.
We will be continuing further tags in our next post. Do let us know what you felt about this information and was it helpful. Do try this example and edit as per your choice.
Code:
<!DOCTYPE html>
<html>
<head>
<title> 12 Basic HTML Tags</title>
</head>
<style>
h1 {
color: brown;
}
h2 {
color: red;
}
h3 {
color: green;
}
h4 {
color: blue;
}
h5 {
color: purple;
}
h6 {
color: black;
}
.topnav {
background-color: yellow;
overflow: hidden;
height: 60px;
text-align: left;
}
</style>
<body bgcolor="skyblue" align="center">
<div class="topnav"><br>
<a class="active" href="#">Home</a>
<a href="#">Ideas</a>
<a href="#">R&D</a>
<a href="#">Research</a>
</div>
<div><br>
12 Basic HTML Tags By Ashish Jha
<h1>India</h1>
<h2>Australia</h2>
<h3>USA</h3>
<h4>JAPAN</h4>
<h5>France</h5>
<h6>UK</h6>
<br>
<p>This is a list of six countries</p><br>
<a href="https://www.google.com">Google</a>
<br><br>
<img src="https://dailyblogday.online/wp-content/uploads/2020/07/cropped-logo-1-4.jpeg" width="450" height="300" />
</div>
</body><br><br>
<footer style="background-color:red;color:white;height: 50px;"><b><br>12 Basic HTML Tags Completed</b></footer>
</html>ALSO READ: World’s First Cyborg: Neil Harbisson!
Not a luxury palace, this is Microsoft’s brand new office!
College Reopen From Feb 15 Safety is major issue
5 Must-Try Shopping Markets in Mumbai!
Follow us on: Twitter
Follow us on: Facebook
Read Everyday Blogs at Daily Blog Day
