[英]How to make a fixed position centered after zooming the whole website out?
我是Web设计HTML / CSS的新手,我们被要求为我们的学校项目创建一个简单的网站,我看到了一个布局并且喜欢这个主意。 这是链接: http : //theme-frsch2.tumblr.com/
我在缩小浏览器(CTRL-/ +)时如何使左侧部分(固定部分)停留在页面中央有问题。 有人可以帮助我实现这一目标吗?
我已经取得了一些进展,并使用了固定在左侧位置的位置,以便即使滚动后它仍会保留在屏幕上,但是当我尝试缩小浏览器时,它一直停留在顶部。
只需使用您引用的站点中的css。
<div id="container"> <!-- horizontal centering (margin:auto) -->
<div class="sidebar"> <!-- keep in screen when zooming (position:fixed) -->
<div class="logo"> <!-- vertical centering (height 50% of 100%) -->
<div class="something"> <!-- rearrange position (position absolute) -->
</div>
</div>
</div>
</div>
#container {
margin: auto;
width: 860px;
}
.sidebar {
width: 400px;
position: fixed;
height: 100%;
}
.logo {
height: 50%;
position: relative;
top: 0;
}
.something {
position:absolute;
}
它对我有用,希望对您有用,在代码末尾添加(如果您只想居中页面,则删除第一行transform: scale(0.8)
body {
transform: scale(0.8); /* for zooming */
transform-origin: 1 0; /* for center position */
transform-origin: top; /* for center to top position */
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.