• • 此问题在此处已有答案**：

（133个答案）
How can I vertically center a div element for all browsers using CSS?（48个答案）
Flexbox: center horizontally and vertically（14个答案）
22小时前关门了。
我想做的是使用<p onclick='this.innerHTML++'>0</p>，并使这段代码有一个黑色的背景，覆盖整个屏幕，并在它的中心文本。我希望它没有一个身体元素或html元素，因为我只想<p>元素。
我尝试在style属性中使用box-shadows和transform属性。

<p onclick='this.innerHTML++' style='color: white; width: 100vw; height: 100vh; transform: translate(-50vw, -50vh); box-shadow: 50vw 50vh black;'>0</p>

这只显示了四分之一的视口四分之一的白色，这意味着框阴影不工作。我发现它添加了一个边距，所以我删除了它。它仍然不工作。它居中的文本虽然。我知道如何用2个元素，但我想保持代码只有<p>元素。
这次我尝试使用background属性。

<p onclick='this.innerHTML++' style='color: white; width: 100vw; height: 100vh; background: black; text-align: center'>0</p>

这一次，除了将文本垂直居中放置外，代码做的一切都很正确。
有没有可能做到这一切在一个元素，居中的文本水平和垂直，并显示一个黑色的背景，覆盖整个屏幕？