Moving Text in HTML
Introduction to Moving Text in HTML Moving text in HTML is also said to be scrolling text. Content can be moved by applying If we set direction property within the Marquee tag, then based on direction, property value content will be moving.
HTML Paragraphs
A paragraph always starts on a new line, and is usually a block of text.
HTML Paragraphs
The HTML
element defines a paragraph.
A paragraph always starts on a new line, and browsers automatically add some white space (a margin) before and after a paragraph.
Example
This is a paragraph.
This is another paragraph.
HTML Display
You cannot be sure how HTML will be displayed.
Large or small screens, and resized windows will create different results.
With HTML, you cannot change the display by adding extra spaces or extra lines in your HTML code.
The browser will automatically remove any extra spaces and lines when the page is displayed:
Example
This paragraph
contains a lot of lines
in the source code,
but the browser
ignores it.
This paragraph
contains a lot of spaces
in the source code,
but the browser
ignores it.
HTML Horizontal Rules
The
tag defines a thematic break in an HTML page, and is most often displayed as a horizontal rule.
The
element is used to separate content (or define a change) in an HTML page:
Example
This is heading 1
This is some text.
This is heading 2
This is some other text.
The
tag is an empty tag, which means that it has no end tag.
HTML Line Breaks
The HTML
element defines a line break.
Use
if you want a line break (a new line) without starting a new paragraph:
Example
This is
a paragraph
with line breaks.
The
tag is an empty tag, which means that it has no end tag.
The Poem Problem
This poem will display on a single line:
Example
My Bonnie lies over the ocean.
My Bonnie lies over the sea.
My Bonnie lies over the ocean.
Oh, bring back my Bonnie to me.
Solution — The HTML Element
The text inside a element is displayed in a fixed-width font (usually Courier), and it preserves both spaces and line breaks:
Example
My Bonnie lies over the ocean.
My Bonnie lies over the sea.
My Bonnie lies over the ocean.
Oh, bring back my Bonnie to me.
HTML Exercises
HTML Tag Reference
W3Schools’ tag reference contains additional information about HTML elements and their attributes.
| Tag | Description |
|---|---|
| Defines a paragraph | |
| Defines a thematic change in the content | |
| Inserts a single line break | |
| Defines pre-formatted text |
For a complete list of all available HTML tags, visit our HTML Tag Reference.
HTML Paragraphs, The HTML
element defines a paragraph. A paragraph always starts on a new line, and browsers automatically add some white space (a margin) before and after a paragraph. Example
This is a paragraph.
This is another paragraph.
Try it Yourself » HTML Dis…Html ParagraphsThe HTML
element defines a paragraph. A paragraph always starts on a new line, and browsers automatically add some white space (a margin) before and …Html Line BreaksThe HTML
element defines a line break. Use
if you want a line break (a new line) without starting a new paragraph: The
tag is an empty tag, whic…Html DisplayYou cannot be sure how HTML will be displayed. Large or small screens, and resized windows will create different results. With …Html Horizontal RulesThe
tag defines a thematic break in an HTML page, and is most often displayed as a horizontal rule. The
elem…Solution — The Html ElementThe HTML element defines preformatted text. The text inside a element is displayed in a fixed-width font (usually Cour… Code sample
This is a paragraph.
This is another paragraph.
Feedback
Moving Text in HTML
Introduction to Moving Text in HTML
Moving text in HTML is also said to be scrolling text. We can scroll the text in all directions with a certain speed of time interval. tag is used to make the next move. There are 4 directions to scroll the text like left direction, the right direction, top direction, and bottom direction. Move the text within the closed area by setting behavior property.
Real-Time Example: Let’s consider we have important updated content on our website frequently. If that content is always stable, users can’t attend to the content, so to get the user’s attention, we have to scroll the updated content always. Depending upon user requirement, we can give direction to which side content scroll. Achieve this requirement tag is used .
Why we use CSS in HTML?
Provide common Logic between all the pages; instead of writing the same style logic in each HTML page, we use a CSS file for writing common logic. And include this CSS page in each HTML page with tag.
How does the Marquee tag work in HTML?
Content can be moved by applying If we set direction property within the Marquee tag, then based on direction, property value content will be moving.
Examples to Implement Moving Text in HTML
Below are the examples mentioned:
Example #1
body Moving Text with Marquee Tag
Explanation: As you can see in the above text moved from right to left even we did not mention any direction, so it is the default marquee tag.
Example #2
Marquee tag in the right direction.
body Moving Text with Marquee Tag
Explanation: As you can see in the above text, moved from left to right by setting direction property to the right.
Example #3
Marquee in the top direction
body Moving Text with Marquee Tag
Explanation: As you can see in the above text, moved from bottom to top by setting direction property to up.
Example #4
Marquee in the bottom direction.
body Moving Text with Marquee Tag
Explanation: As you can see in the above text, moved from top to bottom by setting direction property to down.
Example #5
Marquee with behavior property.
body Moving Text with Marquee Tag
Explanation: As you can see in the above text, moved from left to right and right-left by touching the border by setting behavior property to alternate.
Example #6
Marquee with scroll amount property.
body Moving Text with Marquee Tag
Explanation: As you can see in the above text moved from right to left with different timings, so they are all at different positions.
Conclusion
Moving text in HTML achieved by the marquee tag. We can move the text in left, right, up and down based on the requirement. This marquee feature mostly used by TV channels for a regular update to capture user attention.
Final thoughts
This is a guide to Moving Text in HTML. Here we discuss an introduction, how marquee tag work with syntax and examples to implement.
How to move a Text in Html
If we want to move a text in Html, we have to follow the steps which are given below. Using these steps, we can easily move the text.
Step 1: Firstly, we have to type the Html code in any text editor or open the existing Html file in the text editor in which we want to move the text.
Move the text Hello User.
You are at JavaTpoint Site.
Step 2: Now, we have to place the cursor before that text which we want to move. And, then we have to define the tag, which is used for moving the text on the web page. So, type the open tag before the text we want to move and close the tag just after that text.
Step 3: By default, the text moves from right to left direction on the web page. If we want to specify the direction, then we have to specify the direction attribute in the tag.
Step 4: If we want to move the text alternatively left to right then right to left, then we have to specify the behavior attribute in the tag.
Step 5: If we want to specify the background of that text which is moving on the web page. Then, we have to use the background property in the style attribute as shown in the following block:
Step 6: If we want to specify the border then we have to use the border property in the style attribute.
Step 7: And, at last, we have to save the Html file and then run the file in the browser.
Move the text Hello User.
The output of above Html code is shown in the following screenshot:
How to move a paragraph in html Code Example, html p tag. change on word html. paragraphe en html. how to change text place in html. paragraph in html. how to make a paragraph in html. wright word with <> in html p tag. html paragraph tag. text alagin html.