Several ways to insert spaces in HTML

About HTML, basically we all use it as programmers. In this article, we mainly introduce two methods of inserting spaces in HTML for students who are just getting started.

Method 1. Insert a single space and tab character

1. Insert a non-breaking space. Generally speaking, HTML will only display a blank space between words no matter how many times you press the space bar. When you need to insert multiple spaces, please enter the   or   code. They are called "space placeholders". If you enter a few, they will display a few spaces on the page.

The reason why it is called non-breaking spaces is because it does not produce newlines. If you abuse this spacing, the browser may not be able to insert line breaks in a neat and readable way.

2. Insert spaces of different widths. There are various character entities that allow browsers to display spaces. Different browsers may display this a little differently, but unlike  , they do not affect line breaks:

  — "enspace" is named after the typographic unit of measurement, width. It is the width of two ordinary spaces

  — "em space" is about the width of four ordinary spaces

3. Use non-breaking spaces to simulate tab characters. One way to generate a paragraph is to insert a few spaces before the first line:    . This method only works with HTML and is not recommended if you are using CSS (other methods will be covered in other steps).

If the content of the paragraph is rich text, please use the "pre" tag.

4. Use CSS to generate paragraphs. The inner margin or outer margin of CSS indicates the specific display format to the browser, so the display effect is more consistent. Even if you don't know CSS very well and don't have an instruction sheet handy, it can be easily added. Here are the specific instructions on how to move an entire paragraph to the right:

In the section of the HTML document, insert the following command:

"p.indent" defines a paragraph (labeled p) called "indent" (can be named arbitrarily). The remaining commands add padding space to the left of the paragraph.

Return the body of the HTML document. Whenever you want to add a paragraph, insert the following in the tag:

.

To adjust the amount of indentation, just change the number "1.8" in the CSS command. The following "em" should be retained, it is the unit representing width.

Method 2. Format long paragraphs

1. Use pre-formatted text. The "pre" element can define pre-formatted text, which will preserve spaces or newlines in the text. Therefore, spaces or enter keys entered in the

tag will be displayed as spaces or line feeds. You can use it to display code samples, poetry, or other text content that requires spaces and line breaks.

One of the drawbacks of preformatted text is its width. It cannot adjust the page width to adapt to the user's window size like ordinary hypertext markup languages.

2. Create a newline character. The
tag is placed at the end of the current line of text and inserts a simple line break. You can enter multiple "br" tags to create multiple blank lines. This is a good way for novice HTML students to write code, but when you learn CSS, you will find that this kind of mandatory HTML style code is not recommended. ,

3. Use the "p" tag to define the paragraph. The p element automatically creates some white space before and after it, so the

tag after the text can end the paragraph. Most browsers separate paragraphs with a blank line, but this does not guarantee precise formatting.

If you see some extra symbols "floating" on the code when you finally review the text and code, you need to carefully check whether there is incomplete code, such as writing "
" "

CSS (Cascading Style Sheets) can provide pixel-level precise control over the layout of element positions in web pages (including spacing in text), allowing for better and more precise editing of web page objects and model styles.

Do not enter spaces after the start tag or before the end tag. For example, when typing "Spaces Tutorial" do not write "Spaces Tutorial ".

The non-spacing character ( ) is an example of a character entity. You cannot type such web characters from the keyboard, but you can use the corresponding code to insert the characters.

In fact, what we know about HTML is not difficult, but we can basically use it. I hope these little knowledge can help you lay a solid foundation.

Related recommendations:

htmlspace code

htmlVarious forms of spaces_html/css_WEB-ITnose

Example analysis of how to retain spaces and line breaks in html pages

The above is the detailed content of Several ways to insert spaces in HTML. For more information, please follow other related articles on the PHP Chinese website!