What is HTML?
The Full form of HTML, Hyper Text Markup Language, or HTML is the standard markup language for documents designed to be displayed in a web browser.
HTML is a markup language that defines the structure of your content
OR
HTML is the most basic building block of the Web.
What are Semantic Elements?
Semantics refers to the meaning of a piece of code.
OR we can say that
A semantic element clearly describes its meaning to both the browser and the developer.
Examples of non-semantic elements: <div>
and <span>
- Tells nothing about its content.
Examples of semantic elements: - <form>
, <table>
, and <article>
- Clearly defines its content.
What is Block-Level Element?
- A block-level - element always starts on a new line and takes up the full width available {stretch out to the left and right as far as it can)
Here are the block-level elements in HTML
<address> | <article> | <aside> |
<blockquote> | <canvas> | <dd> |
<div> | <dl> | <dt> |
<fieldset> | <figcaption> | <figure> |
<footer> | <form> | <H1-H6> |
<Header> | <hr> | <li> |
<main> | <nav> | <noscript> |
<ol> | <p> | <pre> |
<section> | <table> | <tfoot> |
<ul> | <video> |
What are Inline Elements?
An Inline element does not start on a new line. An Inline element only takes up as much width as necessary.
This is an <span> element inside a paragraph.
Here are the few Inline elements in HTML
| <a> | <abbr> | <acronym> | | --- | --- | --- | | <b> | <bdo> | <big> | | <br> | <button> | <cite> | | <code> | <dfn> | <em> | | <i> | <img> | <input> | | <kbd> | <lable> | <map> | | <object> | <output> | <q> | | <samp> | <script> | <select> | | <small> | <span> | <strong> | | <sub> | <sup> | <textarea> | | <time> | <tt> | <var> |
Note: - An Inline element can not contain a block-level element.
Difference between Div and span?
<div> tag is used to divide a web page into various sub-section
while the <span> tag is used for grouping and applying styles to inline elements.
<div> element is used to organize your HTML document and makes it readable even to other programmers.
<div> elements do not have any effect on the web browser but make more sense to a developer
While <span> is an inline element that is used to affect a text, or words without causing a line break.
<span> element is Inline and usually used for a small chunk of HTML inside a line (such as inside a paragraph) whereas a div (division).
<div> is a block-line element (which is basically equivalent to having a line - break before and after it) and is used to group larger chunks of code.
What is a Z - index?
Z index ( z-index ) is a CSS Property that defines the order of overlapping HTML elements.
Elements with a higher index will be placed on top of elements with a lower index.
A higher value means the element will be closer to the top of the stacking order.
Z index only works on positioned elements ( position: absolute, position: relative, position: fixed)
Thank you,
Ashish Kr Pal