HTML stands for Hyper Text Markup Language It defines the content and structure of a website It is a markup language HTML Tags 💡 What are HTML Tags? HTML tags are . Each HTML tags have different properties. used to create HTML documents and render their properties 💡 What is HTML Element? The HTML is everything from the start tag to the end tag: element <tagname>Content goes here...</tagname> 1. The Heading Element example:-
<h1>Hello World</h1>
----------------------------
Here 
<h1> is a opening tag where as </h1> is a closing tag

-> anything that's inside an angle bracket(< >) is a tag
-> <h1>Hello World</h1> this entire thing is called an element The heading element ranges from <h1> to <h6> <h1> is the highest section level whereas <h6> is the lowest section level 2. Paragraph Element example:-
<p>This is a paragraph.</p>
-------------------------------------
Here
<p> is a opening tag where as </p> is a closing tag 3. Self-Closing Tags →Horizontal Rule Element syntax:-
<hr /> or <hr> →Break Element syntax:-
<br /> or <br> 4. The List Elements →Ordered and Unordered Lists Unordered List
syntax: <ul>
          <li>Milk</li>
          <li>Flour</li>
        </ul>
Ordered List
syntax: <ol>
           <li>Milk</li>
           <li>Flour</li>
         </ol>
nested unordered list
syntax:<ul>
        <li>Rice</li>
        <li>Flour</li>
        <ul>
            <li>Atta</li>
        </ul>
        <ol>
            <li>aashirwaad</li>
        </ol>
        <li>Milk</li>
    </ul> 5. The Anchor Element →It allows us to create Hyperlink(It is used to link from one page to another) syntax:-
<a href="url/src">This is a link</a>
or we can have global attributes like draggable and set it true which results in the hypertext being draggable. 6. The Image Element →It allows us to add images to our website syntax:-
<img src="url/size" alt="image of some sunset"/>
url followed by the size of the image in pixels File Path →We have different types of two File Path Relative File Path Absolute File Path A relative path describes the location of a file relative to the current (working) directory- An absolute path describes the location from the root directory. →In is more :) Web Development Relative File Path useful Let’s understand with an Relative File Path example →Here since we want to link a file( i.e anchor.html) that is in the same folder a single dot followed by a slash helps us to locate the file In another example →Here The file which we want to link is located in another folder a double dot followed by a slash helps us to locate the desired file(i.e. external.html) HTML BoilerPlate What is an HTML Boiler Plate? A boilerplate in HTML is . You should add this boilerplate to all of your HTML pages. a template you will add at the start of your project <!DOCTYPE html> //This tag tells the browser which version of the file was written in.
<html lang="en"> // this is the language of the text content in that element.
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge"> //this keeps our code compatible with Internet Explorer
    <meta name="viewport" content="width=device-width, initial-scale=1.0"> //it tell you the viewport and it defines how the website should be displayed relative to the screen that it's being rendered on.
    <title>Document</title> //this get displayed in the tab bar 
</head>
<body>
    //this is where all of the content of the website goes.
//the text,the titles,the images,the links,everything that you can do with HTML
</body>
</html> This is the Basic Introduction to HTML we have a few more topics to cover like buttons and etc which we will do as I keep learning :) If you have learned all of the above topics and got a basic idea of HTML you can start learning :) CSS Thank you for reading and keep learning :) Also published here.

Walkthroughs, tutorials, guides, and tips. This story will teach you how to do something new or how to do something better.

The code in this story is for educational purposes. The readers are solely responsible for whatever they build with it.

What is HTML? - A Guide for Beginners

About Author

Comments

TOPICS

THIS ARTICLE WAS FEATURED IN

Related Stories

How a Beginner can Learn HTML in 4 Hours

9 Tips and Best Practices for HTML 5

"A large group of human kind is being left behind" – Jorge Ortega, Noonie Nominee for HTML

An Introduction to CSS for Aspiring Web Designers

HTML Meta Tags And Their Role in Enhancing Your Website's SEO [Explained]

Comparisons and Metaphors in Web Development

How a Beginner can Learn HTML in 4 Hours

9 Tips and Best Practices for HTML 5

"A large group of human kind is being left behind" – Jorge Ortega, Noonie Nominee for HTML

An Introduction to CSS for Aspiring Web Designers

HTML Meta Tags And Their Role in Enhancing Your Website's SEO [Explained]

Comparisons and Metaphors in Web Development

Light-Mode

Classic

Newspaper

Minty

Dark-Mode

Neon Noir

Minty

HN StartUps