html – 相对定位所有元素有什么问题吗?

前端之家收集整理的这篇文章主要介绍了html – 相对定位所有元素有什么问题吗?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我经常发现自己将一个类附加到元素上只是为了给它一个位置:相对;这样我就可以使用position:absolute;

如果我写的话会有什么不妥,或者我应该说会有什么问题吗?

* {
  position: relative;
}

或者可能是下面的例子,因为这些通常是我需要相对定位的唯一元素:

div,navbar,footer,section,aside,header,article {
  position: relative;
}

根据W3schools,所有元素都是位置:静态;默认情况下,根据页面的正常流程定位.

“HTML elements are positioned static by default. A static positioned
element is always positioned according to the normal flow of the
page.”

并且根据相同的来源,相对定位的元素也根据页面的正常流程定位,除非被CSS覆盖:

“The content of relatively positioned elements can be moved and overlap
other elements,but the reserved space for the element is still
preserved in the normal flow.”

解决方法

是的.如果您尝试将一个元素置于绝对位置,则它相对于最近的祖先定位,该祖先具有静态以外的CSS位置.

如果每个元素都有position:relative,那么这将是直接父元素.

但是您可能希望将绝对元素相对于DOM树中的元素进一步放置,或者可能绝对位于页面主体上.

在某些时候,您将遇到无法完全控制HTML的情况.然后你会看到,将所有东西设置为相对来说会适得其反.

一个例子可能是phat图层菜单.在层级ul li元素的丛林深处的某个.menu类中有层.这应该相对于.menu元素的位置定位.您可能不想在此处更改DOM树.

原文链接:https://www.f2er.com/html/231782.html

猜你在找的HTML相关文章