Explain the difference between block elements and inline elements
Explain the difference between block elements and inline elements
Block elements and inline elements are two fundamental concepts in HTML that dictate how elements are displayed on a web page.
Block elements are HTML elements that create a "block" on a page — they start on a new line and occupy the full width of their container, extending from the left edge to the right edge. This means that no other elements can sit next to block elements on the same line; they essentially force a line break before and after themselves. Browsers typically add a margin above and below block elements, which can be adjusted using CSS.
Common examples of block elements include <div>
, <p>
, <h1>
to <h6>
, <ul>
, <ol>
, <li>
, <table>
, and HTML5 semantic elements like <article>
, <section>
, <nav>
, <aside>
, <header>
, and <footer>
[1][2][3][4][5][6][7][8].
Inline elements, on the other hand, do not start on a new line and only take up as much space as necessary. This allows them to sit within a line of text without disrupting the flow. Inline elements can have other inline elements or text beside them on the same line. They do not have top and bottom margins, and setting width and height on these elements will not have any effect.
Examples of inline elements include <span>
, <a>
, <strong>
, <em>
, <img>
, <b>
, and <code>
[1][2][3][4][5][6][7][8].
middle
Gợi ý câu hỏi phỏng vấn
Chưa có bình luận nào