Home >Web Front-end >CSS Tutorial >What does position in css mean?

What does position in css mean?

王林
王林Original
2020-11-24 14:27:0711700browse

Position in css is an attribute that specifies the positioning type of an element. The position attribute defines the positioning mechanism used to establish the layout of the element. Any element can be positioned, but absolute or fixed elements will generate a block-level box, regardless of the type of the element itself.

What does position in css mean?

Environment:

This article applies to all brands of computers.

(Learning video sharing: css video tutorial)

Attribute introduction:

The position attribute specifies the positioning type of the element.

This attribute defines the positioning mechanism used to establish the layout of the element. Any element can be positioned, but absolute or fixed elements generate a block-level box, regardless of the type of the element itself. A relatively positioned element is offset from its default position in normal flow.

Attribute value:

  • absolute Generates an absolutely positioned element, positioned relative to the first parent element other than static positioning. The position of the element is specified through the "left", "top", "right" and "bottom" attributes.

  • fixed Generates absolutely positioned elements, positioned relative to the browser window. The position of the element is specified through the "left", "top", "right" and "bottom" attributes.

  • relative Generates a relatively positioned element, positioned relative to its normal position. Therefore, "left:20" adds 20 pixels to the element's LEFT position.

  • static Default value. Without positioning, the element appears in normal flow (ignoring top, bottom, left, right or z-index declarations).

  • #inherit Specifies that the value of the position attribute should be inherited from the parent element.

Example:

Positioning h2 element:

h2
  {  
  position:absolute;
  left:100px;
  top:150px;
  }

Related recommendations: CSS tutorial

The above is the detailed content of What does position in css mean?. 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