Network Security Internet Technology Development Database Servers Mobile Phone Android Software Apple Software Computer Software News IT Information

In addition to Weibo, there is also WeChat

Please pay attention

WeChat public account

Shulou

What are the categories of html5 elements

2025-04-12 Update From: SLTechnology News&Howtos shulou NAV: SLTechnology News&Howtos > Development >

Share

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

This article mainly explains "which categories are divided into html5 elements". The content of the explanation in the article is simple and clear, and it is easy to learn and understand. Please follow the editor's train of thought to study and learn "which categories are divided into html5 elements".

Html5 elements can be divided into two categories: 1, "block-level elements"; this element has a unique line and always starts on a new line, and the width and height of the element, as well as the outer and inner margins, can be controlled. 2. "inline element"; this element and other elements will be displayed on the same line, and the width, height, outer and inner margins of the element can not be changed.

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

HTML tags (elements) can be divided into two categories, block-level elements and inline elements (also known as inline elements).

Block level element

The most important feature of block-level elements is that they have their own row, and the most representative of block-level elements are, in addition,

, ~, etc.

Block-level elements generally have specific semantics that can make the code more readable.

The main characteristics of block-level elements are as follows:

Whether or not you use a newline label

Block-level elements always start on a new line

The width, height, outer and inner margins of block-level elements can be controlled.

If you omit the width of a block-level element, its width defaults to the width of the current browser window

Block-level elements can contain other inline elements and block-level elements.

Inline element

Inline elements can also be called inline elements, and the most commonly used inline elements are, and so on.

Inline elements often have some special display effect, which can replace part of the CSS style, which is very useful, such as:

And tags can modify fonts

And two tags are used to define subscript text and superscript text, respectively.

The main characteristics of the inline elements are as follows:

Inline elements and other elements are displayed on the same line

The width, height, outer and inner margins of the inline elements can not be changed.

The width of an inline element is the width of its contents and cannot be changed.

Only text or other inline elements can be contained in inline elements.

For the use of inline elements, you need to pay attention to the following:

Invalid set width width

Setting height height is not valid, but row height can be set through line-height

The margin outer margin can be set, but it is only valid for the left and right outer margins, not up and down.

When setting the padding inner margin, only the left and right padding is valid, while the upper and lower padding is invalid. It should be noted that the element range is increased, but it has no effect on the content around the element.

You can switch elements between inline and block-level elements through the display attribute.

Expand knowledge: focus on two tags

And are the most commonly used block-level elements and inline elements, respectively, which we need to focus on.

1) label

Is a very important block-level tag, plays an important role in the page layout (Layout), using we can define each part of the page, through the combination with CSS can achieve a variety of effects, the following through an example to demonstrate the use of tags.

Label demonstration large front-end tutorial HTML video tutorial CSS video tutorial javascript video tutorial vuejs video tutorial

The tag and its surrounding content can be regarded as a section of the web page, and the tag itself does not have any special display effect, so it needs to be set with the help of CSS style, such as external margin, inner margin, background, frame and so on, so as to achieve the purpose of plate layout.

2) label

The tag in HTML is an inline element that modifies the content in an HTML document. This tag does not provide any visual effect for the content of the document, but can be used in conjunction with CSS to beautify a web page.

Here is an example to demonstrate the use of tags:

Document .car {width: 110px; height: 35px; border: 1px solid black; font-size: 14px; line-height: 35px; text-indent: 32px; background: url (. / img/buy.png) no-repeat 8px 11px; background-color:#ffffff } span {color: blue; font-size: 20px; font-family: "Song style";} my shopping cart

The results show:

The tag itself has no special effect, and you usually need to change the style of the content with the help of CSS, such as font, color, size, border, background, etc.

Note: HTML inline tags that are not recommended, such as, etc., are recommended to use + CSS style instead; but inline tags with clear semantics, such as, etc., should still be used, these tags are more semantic and more helpful for search engines to understand the content of the page.

Thank you for your reading, the above is the content of "what categories are the html5 elements?" after the study of this article, I believe you have a deeper understanding of the question of which categories the html5 elements are divided into, and the specific use needs to be verified in practice. Here is, the editor will push for you more related knowledge points of the article, welcome to follow!

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.

Views: 0

*The comments in the above article only represent the author's personal views and do not represent the views and positions of this website. If you have more insights, please feel free to contribute and share.

Share To

Development

Wechat

© 2024 shulou.com SLNews company. All rights reserved.

12
Report