Shulou(Shulou.com)05/31 Report--

This article introduces the relevant knowledge of "which types of html5 tags are divided into". In the operation of actual cases, many people will encounter such a dilemma, so let the editor lead you to learn how to deal with these situations. I hope you can read it carefully and be able to achieve something!

There are three types of html5 tags: 1, block-level elements, whose display value is "block", characterized by the ability to set width and height, margins, and will automatically wrap; 2, inline elements, whose displayvalue is "inline", will not automatically wrap, and cannot set width and height; 3, inline block elements, will not automatically wrap, can be set width and height.

The operating environment of this tutorial: windows7 system, CSS3&&HTML5 version, Dell G3 computer.

Classification of html5 markers

Tags are also called elements

According to the label characteristics, it can be divided into: block label, inline (inline) label, inline block label.

According to the label closure rules, it can be divided into single tag (empty tag, self-closing tag) and double label.

Commonly used block elements:

.

Commonly used inline elements:

Commonly used inline block elements:

Features of block-level elements: display:block

1. Each block-level element starts on a new line, and subsequent elements start on another line.

2. The height, width and row height of the element, as well as the margin and padding values above and below can be set.

3. If not set, the width of the element is 100% of its parent container (consistent with the width of the parent element), unless a width is set.

Features of inline elements: display:inline

1. And other elements are all on one line

2. The height, width and top and bottom margins of the element cannot be set (only margin and padding in the left and right directions are supported)

3. The width of an element is the width of the text or picture it contains and cannot be changed.

Characteristics of intra-line block elements: display:inline-block

1. And other elements are all on one line

2. The height, width, row height and top and bottom margins of the element can be set. (support margin and padding values above and below)

3. Invalid margin:0 auto

4. Arrange horizontally, but all elements will have a space gap by default, because there is a carriage return line feed between elements in html, and the browser parser will parse it into a space.

Conversion of tag types

The type of the tag can be converted:

Set display:inline to convert to inline elements

Set display:linline-block to convert to inline block elements

Set display:block to convert to block-level elements

This is the end of the content of "which categories of html5 tags". Thank you for your reading. If you want to know more about the industry, you can follow the website, the editor will output more high-quality practical articles for you!

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.