使元素滚动而无需固定位置设置

Question

有没有办法让元素在不固定位置的情况下随背景滚动？所以在调整窗口大小时不会引起问题？ 我所说的元素在css中的引用如下。

#logo {
        margin: 20px auto;
        width:355.2px;
        height:148.8px;

Answer 1

如果不使用固定位置，这是无法完成的，为了解决调整大小的问题，您需要使用屏幕查询。这是一个如何在 style.css 文件和 list of default screen sizes

上使用它的示例

=== 已根据您的需要进行更新 ===

为了在屏幕中间对齐您的徽标，而不是按照您在 cmets 上的要求将其显示在较小的屏幕上，您需要为您的#logo 使用绝对位置，以便在您滚动页面，将其包装在一个固定的 div 中。这是诀窍

/* Your normal css goes here */
.logoContainer{
    position:fixed;
}
#logo {
    left:50%; /* this puts your logo on the middle of the screen */
    width:38px;
    margin-left:-19px; /* this needs to be half of the width */
    position:absolute;
}

/* Smartphones (portrait) ----------- */
@media only screen and (max-width : 320px) {
    /* Your fix for smaller screen sizes example*/
    #logo {
        display:none; /* this tells your div to not display */
    }
}

这是online example