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

          🎉 100%-OFF Udemy Coupons (New Daily)

          Grab premium courses for ₹0. We verify coupons daily so you don’t waste time on expired links.

          Browse Free Coupons → Top-Rated • Expiring Soon • By Language

          Tutorials for all brains!

          HTML Tutorials

          HTML Home HTML Requirements HTML Getting Started HTML Tags HTML Headings and paragraphs HTML elements HTML Comments HTML Formatting HTML Attributes HTML Lists HTML Phrase tags – Citation and Quotation HTML Images HTML Links HTML Tables HTML Fonts HTML Blocks HTML Forms HTML Head HTML Meta Tags HTML Styles HTML Backgrounds HTML Colors HTML Color Values HTML Entities HTML Character Encoding HTML URL Encodes HTML Iframes HTML JavaScript HTML XHTML HTML Responsive Web Design

          Advanced

          HTML5 Canvas HTML5 SVG HTML5 Audio HTML5 Video

          Cheat Sheet & Reference

          HTML Cheat Sheet HTML Tags - Alphabetical order HTML Tags List Reference

          Complete Tag List

          <!--..--> <!DOCTYPE> <a> <abbr> <acronym> <address> <applet> <area> <article> <aside> <audio> <b> <base> <basefont> <bdi> <bdo> <blockquote> <body> <br> <button> <canvas> <caption> <center> <cite> <code> <col> <colgroup> <data> <datalist> <dd> <del> <details> <dfn> <dialog> <dir> <div> <dl> <dt> <em> <embed> <fieldset> <figcaption> <figure> <font> <footer> <form> <h1> - <h6> <head> <header> <hgroup> <hr> <html> <i> <iframe> <img> <input> <ins> <kbd> <keygen> <label> <legend> <li> <link> <main> <map> <mark> <menu> <menuitem> <meta> <meter> <nav> <noscript> <object> <ol> <optgroup> <option> <output> <p> <param> <pre> <progress> <q> <rp> <rt> <ruby> <s> <samp> <script> <section> <select> <small> <source> <span> <strike> <strong> <style> <sub> <summary> <sup> <svg> <table> <tbody> <td> <template> <textarea> <tfoot> <th> <thead> <time> <title> <tr> <track> <tt> <u> <ul> <var> <video> <wbr>

Từ khóa » Html Block Element List