Element Types

Elements in HTML can be classified as inline or block based on their behavior.

• Inline elements stay on the same line as other elements, only taking up as much width as needed. Examples: <a>, <span>, <img>, <input>;
• Block elements start on a new line and take up the full width of their container. Examples: <div>, <h1>–<h6>, <p>, <ul>, <li>.

Block Elements

Block elements occupy the entire width of their container and always start on a new line. They can be styled using CSS properties like width, height, margin, padding, and border. Common examples of block elements include <div>, <p>, <ul>, and <li>.

Inline Elements

Inline elements stay on the same line as other elements and only occupy the width needed for their content. Unlike block elements, inline elements cannot have width, height, margin, or padding values assigned, but border can still be applied. Examples of inline elements include <a>, <span>, <img>, and <input>.

Inline-block Elements

Inline-block elements do not start on a new line but combine the styling flexibility of block elements. They can be customized using CSS properties like width, height, margin, padding, and border. Examples of inline-block elements include <button>, <select>, and <textarea>.