What is an HTML elements ?
HTML element is an individual component/part of an HTML document.
HTML element represents semantics, or meaning of the webpage.
HTML elements can also contain attributes that defines its additional properties.
How HTML elements are implemented ?
HTML elements are responsible for creating web pages and define content in the webpage.
It have a start tag <tag name>, attributes and close tag </tag name> and webpage content inserted between them.
What are self-closing elements ?
Some HTML elements does not have end tag and content, these elements are termed as self-closing elements or void elements.
For example <br/> element is an self-closing elements.
Simple website coding in HTML !!!
Click to Learn More about – HTML Tutorial for beginners
What is Nested HTML Elements ?
HTML allows us to implement the nested elements, which means an element can contain another element.
Some of the basic elements of the HTML webpage is,
1. Heading tag, denoted using the <h1>, <h2>, <h3>, <h4>, <h5>, <h6> tags.
2. Paragraph tag, denoted using the <p> tag.
3. Horizontal ruler tag, denoted using the <hr> tag.
4. Link tag, denoted using the <a> (anchor) tag.
5. List tag, denoted using the <ul> (unordered list), <ol> (ordered list) and <li> (list element) tags.
6. Image tag, denoted using the <img> tag
7. Divider tag, denoted using the <div> tag
8. Span tag, denoted using the <span> tag
What are the types of HTML elements?
Basically there are two types of HTML elements, they are
1. Block-level elements
2. Inline elements
Want to Learn More About – HTML Attributes
Let Us Discover More About – HTML Attributes
1. Block-level elements
Block-level elements provides the proper structure of the webpage and its considered as the most important elements.
Block-level elements divides the webpage in to multiple blocks which is then re-arrannged to get proper structure while coding.
Block level elements are always implemented in new line with full width of web page, from left to right.
Block level elements can have both block-level as well as inline elements.
Some of the block-level elements listed below,
<address>, <article>, <aside>, <blockquote>, <canvas>, <dd>, <div>, <dl>, <dt>, <fieldset>, <figcaption>, <figure>, <footer>, <form>, <h1>-<h6>, <header>, <hr>, <li>, <main>, <nav>, <noscript>, <ol>, <output>, <p>, <pre>, <section>, <table>, <tfoot>, <ul> and <video>.
Example :
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div style="background-color: green">First Div</div>
<div style="background-color: brown">Second Div</div>
<div style="background-color: black">Third Div</div>
<div style="background-color: blue">Fourth Div</div>
<p style="background-color: red">Block level element</p>
</body>
</html>
Output :
Want to Learn More About – HTML Formatting
Let Us Discover More About – HTML Formatting
2. Inline elements
Inline elements are mostly used with other elements.
Inline elements provides the changes to the particular element for which is implemented.
Some of the inline elements listed below,
<a>, <abbr>, <acronym>, <b>, <bdo>, <big>, <br>, <button>, <cite>, <code>, <dfn>, <em>, <i>, <img>, <input>, <kbd>, <label>, <map>, <object>, <q>, <samp>, <script>, <select>, <small>, <span>, <strong>, <sub>, <sup>, <textarea>, <time>, <tt>, <var>.
Example :
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<a href="https://secureservercdn.net/192.169.221.188/s30.e0b.myftpupload.com/wp-content/uploads/2020/06/HTML-PixTeller-1-2.png">Click on link</a>
<span style="background-color: red">Inline element</span>
</body>
</html>
Output :
All these HTML elements will discussed in future chapters.
HTML Examples of websites !!!
Click to Learn More about – HTML5 Tutorial for beginners
Video Tutorial – Watch on Youtube
Want to Learn More About – HTML Tags
Let Us Discover More About – HTML Tags