Most Important Question in HTML

Most Important Question in HTML

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