HTML Blocks — Block Level And Inline Elements HTML - TutorialBrain

Trang chủ » Html Block Element List » HTML Blocks — Block Level And Inline Elements HTML - TutorialBrain

Có thể bạn quan tâm

Prev Next

HTML Blocks

HTML Block-level elements

  1. In HTML block-level elements is given within <body>..</body> tag
<!DOCTYPE html> <html> <body> <h4>Block level elements comes within body tag</h4> </body> </html>

2. Block-level elements always start with the new line.

<!DOCTYPE html> <html> <body> <p>Block level elements starts with new line tag</p> <p>This paragraph will start in new line</p> </body> </html>

3. Inline elements come within block level elements

<!DOCTYPE html> <html> <body> <p>This is block level element<b>This is inline element</b></p> </body> </html>

List of HTML Block level elements

Block Level Elements

HTML Inline elements

  1. In HTML inline elements is also given within <body>..</body> tag 
<!DOCTYPE html> <html> <body> <h4>Inline elements comes within body tag and inside block level elements. For example, <b> Here b(Bold) tag is inline element</b></h4> </body> </html>

2. Inline elements will not start in a new line.

<!DOCTYPE html> <html> <body> <p>Inline elements will not start in new lines. For example, <i>i(italic) tag is inline element so content given inside i tag </i> will not start in new line</p> </body> </html>

3. Inline elements come within block level elements

<!DOCTYPE html> <html> <body> <p>This is block level element<kbd>This is inline element</kbd></p> </body> </html>

List of HTML inline elements

Block Level Elements Follow @tutorial_brain

Grouping Tags

The most commonly used tags to group other HTML tags are <div> tag and <span> tag.

<div> Tag

This is the most important tag used while grouping other tags in HTML. CSS can be applied in <div> tag. This tags also used to create a layout of web page.The <div> tag is used in Block level elements.

Example

<div style ="border:2px solid crimson; background:pink; color:slateblue;"> Run the Code

<span> Tag

The <span> tag is used in inline elements.

HTML Tag example

Example

<span style="font-size:1.5em; font-family:Trebuchet MS">Tutorial</span> <span style="font-size:1.6em; background-color:#F50579;color:#C5F505;">Brain</span> Run the Code

Interview Questions & Answer

  1. What are inline elements and block-level elements in HTML?

    Inline elements are the elements that will only take the width that is required to fit into the container. It comes within block level element and do not start with new line. Inline level elements are:-

    <object>, <big>, <img>, <i>, <a>, <strong>, etc.

    Block elements are the blocks that takes the full available width and always start from a new line. It will stretch itself to the full available width of the available container width. Block level elements are:-

    <ol>, <div>, <p>, <section>, etc.
    1. What is the use of <div> tag in HTML?

      This is the most important tag used while grouping other tags in HTML. This tag defines a division or a section in an HTML document. CSS can be applied in to div tag. This tags is also used to create a layout of web page. It is used in Block level elements.

      1. What is the difference between Div and Span in HTML?

        Span element is inline whereas Div element is block-line.Span is used for a small part whereas Div is used for larger part.

        1. Can we change inline elements into block-level elements?

          Yes, we can change inline elements into block-level elements by adding:-

          display: block; Prev Next Facebook Twitter Google-plus

          Tutorials for all brains!

Từ khóa » Html Block Element List