Shulou(Shulou.com)06/01 Report--

This article will explain in detail how to do a good job of html typesetting tags. The editor thinks it is very practical, so I share it with you for reference. I hope you can get something after reading this article.

Comment tag paragraph tag

This is a paragraph

This is another paragraph

Attributes:

Align= "attribute value": alignment Property values include left center right.

For example:

Paragraph, is the English paragraph "paragraph" abbreviation.

HTML tags are hierarchical, and HTML divides all tags into two categories:

Text-level tags: P, span, a, b, I, u, em. Text-level tags can only contain text, pictures, and form elements. (you can't put an and input in a tag)

Container level tags: div, h series, li, dt, dd. Anything can be placed in a container-level label.

From the first day of learning p, we should keep in mind that the p tag is a text-level tag, in which only text, pictures and form elements can be put. Nothing else can be played.

Wrong spelling: (try to put h in p)

I'm a small paragraph. I'm a first-level title.

The effect of the web page is as follows:

The image above shows that the browser does not allow you to do this, and we used the F12 review element of Chrome to find that the browser itself closed p and did not allow you to package H2.

PS:Chrome browser is the best browser supported by HTML5 in the world. Provides a very good development tools, very suitable for our developers to use. The shortcut key to review the element function is F12.

Block-level labels and

Div and span are very important tags, the semantics of div is division "segmentation"; the semantics of span is span "scope, span".

As you will know in the CSS course, these two things are the most important "boxes".

Div: treat the contents of the tag as a block (division). Must occupy a separate line.

Attributes of the div tag:

Align= "attribute value": sets the location of the block. Attribute values can be selected: left, right, center.

And the only difference is: do not change the line, but the new line.

If you insert these two elements into the page separately, it will not have any impact on the page. These two elements are created specifically to define CSS styles. In other words, DIV+CSS to implement various styles.

Examples of effects:

Div does not add any effect by default in the browser, but the semantics have changed, and all the elements in the div are a small area.

The div tag is a container-level tag that can put anything in it, even div itself.

Span is also a label that expresses "small area, small span", but it is a text-level tag.

In other words, only text, pictures, and form elements can be placed in span. You cannot put p, h, ul, dl, ol or div in span.

There are small elements in span and big things in div. Examples are as follows:

For example, span:

Introduction introduction details purchase

For example, div:

Therefore, we affectionately call this pattern "div+css". Div tags are responsible for layout, structure and segmentation. Css is responsible for the style.

Newline label

(abandoned)

When you are going to end a line and you don't want to start a new paragraph

The label will come in handy. No matter where you put it

Tags produce a forced line break.

This

Is a para

Graph with line breaks

The effect is as follows:

The above figure shows

Label and

The difference between labels is:

The tag automatically inserts a blank line before and after the paragraph, and

The label has no blank line; and

The tag has no attributes.

Be careful

There is no end label, put

The tag is written as a way to stand the test of the future, and both XHTML and XML accept the practice of closing the tag inside the open tag.

Horizontal label (obsolete)

A horizontal separation line (horizontal rule) visually divides a document into sections.

The effect is as follows:

Attributes:

Align= "attribute value": sets the position of the line. Attribute value can be selected: left right center.

Size= "2": sets the line thickness. In pixels, it is set to 2.

Width= "500" or width= "70%": sets the line length. It can be an absolute value in pixels or a relative value. If set to a relative value, it is set to 100% internally.

Color= "# 0000FF": sets the line color.

Noshade: no shadows, that is, set the lines to be flat. Without this attribute, it indicates that the line has a shadow or solid, which is the default value.

Demonstration of attribute effects:

Content centered label

At this point, center represents a tag, not an attribute value. As long as it is in this tag, it will be in the middle of the browser.

Demonstration of the effect:

In H5, the center tag is not recommended.

Predefined (preformatted) tags:

Meaning: all white space characters (spaces, line breaks) will be retained, and the output will remain intact (tell the browser not to ignore spaces and blank lines)

Explanation: tags are rarely used in the real process of arranging web pages. Can be used in PHP to print an array.

Demonstration of the effect:

In the image above, it seems that the font in the red box has become smaller and indented. Well, this is actually caused by the browser.

Why do you have this label? The answer is:

All browsers ignore spaces and blank lines by default.

Well, in fact, this label is also used less.

This is the end of this article on "how to make a good typesetting tag for html". I hope the above content can be of some help to you, so that you can learn more knowledge. if you think the article is good, please share it for more people to see.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.