这个问题是关于 JQuery Mobile 的。我有一个只包含一个标题和一个按钮的屏幕。默认情况下，它出现在屏幕顶部。我想知道如何将它对齐到屏幕中间。
干杯。
最佳答案
我假设您只想垂直对齐按钮，并将页眉留在页面顶部。垂直居中的最简单方法是绝对定位并将其顶部设置为 50%。这会将内容的顶部放在屏幕中间。
如果您希望内容的垂直居中位于屏幕中间，那么您必须知道居中内容的高度并使用负上边距将内容向上移动该高度的一半。使用 jQuery Mobile 添加的内边距和边框，具有 1em 字体大小文本的按钮将具有大约 2.4em 的高度，需要向上移动 1.2em。
这是一个例子，我把我的按钮放在一个 div 中并绝对对齐 div:
<!DOCTYPE html>
<html><head>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a3/jquery.mobile-1.0a3.min.css" />
<script src="http://code.jquery.com/jquery-1.5.min.js"></script>
<script src="http://code.jquery.com/mobile/1.0a3/jquery.mobile-1.0a3.min.js"></script>
</head><body>
<div data-role="page">
<div data-role="header">Header</div>
<div data-role="content">
<div style="position: absolute; top: 50%; margin-top: -1.2em;">
<a href="index.html" data-role="button">Button</a>
</div>
</div>
</div>
</body></html>
当我自己尝试这个时，按钮的宽度从屏幕的整个宽度变为可能的最小宽度。如果您仍然希望按钮在屏幕上拉伸(stretch)，则添加“width:100%; margin-left: -1em;”到包含 div 的样式属性。
关于css - JQuery Mobile - 在屏幕中间对齐按钮，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/6405034/