如何将页面内容设置到屏幕中间? [英] How to set page content to the middle of screen?

查看:1296
本文介绍了如何将页面内容设置到屏幕中间?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述


可能重复:

如何对齐< div>到页面中间

我需要的是显示网页在屏幕中间,不管是什么屏幕尺寸,大或小,分辨率高或低,它总是自动调整到屏幕中间。

I need is to show the content of a web page in the middle of the screen, no matter what screen size it is, big or small, resolution high or low, it always gets automatically adjusted to the middle of screen.

推荐答案

我猜你想要垂直和水平的中心框,不管浏览器窗口大小。由于您的方框有固定的宽度和高度,因此应该可以使用:

I'm guessing you want to center the box both vertically and horizontally, regardless of browser window size. Since you have a fixed width and height for the box, this should work:

标记

<div></div>

CSS:

div {
    height: 200px;
    width: 400px;
    background: black;

    position: fixed;
    top: 50%;
    left: 50%;
    margin-top: -100px;
    margin-left: -200px;
}

即使调整浏览器大小,div也应保留在屏幕中央。只需将页边距和页边距换成表格高度和宽度的一半即可。

The div should remain in the center of the screen even if you resize the browser. Just replace the margin-top and margin-left with half of the height and width of your table.

编辑:信用转到 CSS-Tricks ,其中我得到了最初的想法。

Credit goes to CSS-Tricks, where I got the original idea.

这篇关于如何将页面内容设置到屏幕中间?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆