Home >Web Front-end >CSS Tutorial >What are the similarities between css row elements and block elements?

What are the similarities between css row elements and block elements?

青灯夜游
青灯夜游Original
2020-12-17 11:36:452351browse

Same points: 1. Both row elements and block elements have a display attribute, which is used to specify the type of box that the element should generate; 2. Both row elements and block elements can set left and right horizontal margin and padding values. .

What are the similarities between css row elements and block elements?

The operating environment of this tutorial: windows7 system, css3 version. This method is suitable for all brands of computers.

Row elements (also known as inline elements) and block elements are concepts in the HTML specification. A block element is generally a container element for other elements and can accommodate other block elements or inline elements. Inline elements are generally basic elements based on semantic level and can only accommodate text or other inline elements.

Characteristics of block elements:

  • Always start a new line (unique)

  • You can set its width, Height, inner and outer margins

  • If the width is not set manually, the width defaults to 100% of the container (that is, the width of the container)

  • Can accommodate inline elements and other block elements.

Characteristics of row elements:

  • Always on the same line as adjacent inline elements (birds of a feather flock together)

  • Setting the width and height is invalid. The padding and margin attributes in the horizontal direction can be set, but the vertical ones are invalid.

  • The default width is the width of its own content.

  • Inline elements can only hold other inline elements or text.

The similarities between row elements and block elements

1. Both have a display attribute, which specifies the type of box that the element should generate.

2. You can set the left and right margin and padding values ​​

The difference between block elements and line elements

1. Block elements are always Starts on a new line; inline elements are on the same line as other elements.

2. Block elements can accommodate other block elements or inline elements; inline elements can only accommodate text or other inline elements.

3. The height, line height and top and bottom margins of block elements can be controlled; the height, line height and top and bottom margins of inline elements cannot be changed.

(The difference above refers to the default situation and does not include deliberate control of CSS. That is to say, when using CSS control, the attribute difference between block elements and inline elements will become smaller and smaller. .)

For more programming-related knowledge, please visit: Programming Course! !

The above is the detailed content of What are the similarities between css row elements and block elements?. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn