<html>
<head>
<h1>Hello.</h1>
</head>
<link rel="stylesheet" type="text/css" href="butters.css">
<link href="https://fonts.googleapis.com/css?family=Galada" rel="stylesheet">
<body></body>
</html>
h1{
font-family: 'Galada', cursive;
font-size: 400%;
position: relative;
top: 50%;
left: 50%;
transform: translateY(-50%);
}
Link to fiddle. I pretty much followed this tutorial.
我雖然發現問題與它,因爲它創造了水平滾動條,這是我不想,我不相信這是水平居中。我只是想讓它在屏幕中間輕拍一下,不管屏幕大小如何,但我不確定要做什麼CSS。
謝謝! [它現在幾乎可以工作](https://jsfiddle.net/6oyq0szs/1/),但似乎儘管有50%,但頂層空間比底層空間要多。你也看到了嗎?還是我只是妄想? – somanyerrorswhy
是的,你說得對。它發生是因爲元素的頂部是有效地居中的東西。我改變了CSS,以像素爲單位指定'font-size',並用字體大小的一半來計算'top'作爲折扣。 –