Classification of HTML elements in CSS and CSS of HTML elements

Classification of HTML elements in CSS and CSS of HTML elements

Elements are the basic structure of HTML documents, such as h1, p, ul, and div. In CSS, elements can be divided into "replacement element" and "non-replacement element ". If you look at the display effect of elements, the elements can also be divided into "block-level elements" and "intra-row elements ".

I. replacement element and non-replacement element

(1) replacing elements

The content displayed by the element in the browser is not directly expressed by the content of the element in the HTML document.

For example, img . The img element does not have any content. It is displayed in the browser as an image outside the HTML document.

(2) non-replacement Elements

The content displayed in the browser is the content in the HTML document. For example, the first section of p elements <p> </p>, although the color and font of p elements are presented according to the design of the author, however, the content "the first section" is displayed in the browser.


Ii. Block-level elements and intra-row Elements

(1) block-level elements

Block-level elements are characterized by exclusive one row, full parent-level elements with the default width, configurable width and height, including other block-level elements, and intra-row elements (note that the p element is an exception. The p element is a block-level element, but it can only contain intra-row elements ).


(2) Intra-row Elements

An element in a row has the following characteristics: a row with other elements, the default width is the width of its content, the width cannot be set to a height, and can contain other elements in the row.