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

How to understand the application of absolute and relative in CSS position attributes

2025-03-31 Update From: SLTechnology News&Howtos shulou NAV: SLTechnology News&Howtos > Development >

Share

Shulou(Shulou.com)06/02 Report--

In this issue, the editor will bring you about how to understand the application of absolute and relative in CSS position attributes. The article is rich in content and analyzes and narrates it from a professional point of view. I hope you can get something after reading this article.

To describe the application of absolute and relative of position in CSS, position attribute actually refers to the positioning of the ontology to the superior, absolute refers to absolute positioning, and relative refers to relative positioning. The effect of the attribute value of position is directly affected by the position attribute value in its container style.

Application of absolute and relative of position in CSS

Position attribute in CSS

Before, I couldn't understand that I could only rely on a short-term "masochistic experience" to produce the desired effect. Later, I carefully studied the XScroller of Hutia, and read the document carefully, only to know that this position attribute actually refers to the positioning of the ontology to the superior. If you understand it in this way, it will be easy.

The default attribute value is static, static. You don't have to say any more. The most important things are relative (relative) and absolute (absolute). Often, if we are COPY other people's code, we will combine absolute attributes with left and top to create related "suspension layer" effects. Sometimes, however, we need to target the suspension effect of a container, not the window. At this time, the calculation of height and width is not only troublesome, but also almost impossible to achieve the effect. There was nothing I could do at first, but later I found that all I had to do was to set the style property position one level above it to relative.

That is, the effect of the property value of position is directly affected by the value of the position property in its container style. For example, the nested structure of Amurb is as follows:

Viewplaincopytoclipboardprint?

When the position of An is relative, the position of B is absolute. At this point, left:0 and top:0 are no longer for window documents, but for this div with an id of A.

In this way, it is convenient to add some UI elements, such as the close button of a certain active layer, when developing some Bamp S-based applications.

The above is how to understand the application of absolute and relative in CSS position attributes. If you happen to have similar doubts, you might as well refer to the above analysis to understand. If you want to know more about it, you are welcome to follow the industry information channel.

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