The <spacer> element is used to insert spaces on the web page.
Sometimes you may need to put space into your document. Often this is done with the use of invisible images that can be fully transparent, or have the same color as the background. However, these methods aren’t reliable. To include blank space in a document, you can use the <spacer> element. It is like an image, but actually, there isn’t a picture there.
You should specify <spacer> as one of the following types: horizontal, vertical, and block, which can be both horizontal and vertical. To do this, use the type attribute.
There are many options for adding and controlling blank space on the web-page:
- The <p> tag creates a paragraph break.
- The <br> tag indicates a line break.
- The <pre> tag is used with a preformatted text. It instructs the browser that the text should appear exactly as it is in the HTML file, including blank lines and spaces.
- The character creates non-breaking space.
- The 	 and 	 characters create tab spaces in HTML. But they can't be used independently.
- You can also add space around a text with CSS.
Syntax
The <spacer> tag is empty, which means that the closing tag isn’t required.
Example of the HTML <spacer> tag:
<!DOCTYPE html>
<html>
<head>
<title>Title of the document </title>
<style>
div {
display: block;
text-align: center;
}
</style>
</head>
<body>
<div>
PageUp↑
<br> ←Home
<spacer type="horizontal" width="100" height="100"> ♢ </spacer>
End→
<br> PageDown↓
</div>
</body>
</html>
Result
Attributes
Attribute | Value | Description |
---|---|---|
align | align | Defines the alignment of the element relative to the content. |
height | height | Defines the height of empty space in pixels. |
size | size | Defines the pixel number of empty space, depending on the type attribute. |
type | block horizontal vertical |
Indicates the element type. |
width | width | Defines the width of an empty space in pixels. |
The <spacer> tag supports the Global Attributes and the Event Attributes.
Browser support
✕ | ✕ | ✕ | ✕ | ✕ |
Practice Your Knowledge
Quiz Time: Test Your Skills!
Ready to challenge what you've learned? Dive into our interactive quizzes for a deeper understanding and a fun way to reinforce your knowledge.