CSS3：如何在div內垂直對齊文本？

我有一個自定義字體的div，我試圖讓它使得文本與它所在的div具有相同的高度。CSS3：如何在div內垂直對齊文本？

我一直在試圖找到一種方法來覆蓋沒有div的文本的垂直對齊而沒有成功。我希望有這樣的文字縮進方法。

Here's a simple JsFiddle with my example.

<!DOCTYPE html> 
<html> 
<head> 
<link href='http://fonts.googleapis.com/css?family=Lekton' rel='stylesheet' type='text/css'> 
<style> 
.texto { 
    background-color: #000; 
    height: 24px; 
    font-family: 'Lekton', sans-serif; 
    color:white; 
    font-size: 24px; 
} 
</style> 
</head> 
<body> 
    <div class="texto">Test</div> 
</body> 
</html>

來源

2015-01-09 Alejandro Gorgal

使用line-height CSS屬性：

line-height : 24px;

來源

2015-01-09 19:30:15 potashin

添加行高與屬性值測量含有DIV的高度

<style> 
 
    .texto { 
 
     background-color: #000; 
 
     height: 24px; 
 
     font-family: 'Lekton', sans-serif; 
 
     color: white; 
 
     font-size: 24px; 
 
     line-height: 24px; /* This line solves your problem */ 
 
    } 
 
</style> 
 
</head> 
 
<body> 
 
    <div class="texto">Test</div> 
 
</body>

來源

2015-01-09 19:31:24

CSS3：如何在div內垂直對齊文本？

回答

相關問題