html - 让文本在 div 方块的中心对齐

Question

我正在努力将文本添加到用 HTML 和 CSS 编写的消失/出现的方形系统。是否有一种简单的方法可以将段落标签添加到每个正方形的中心？这是我的代码：jsfiddle.net/busterroni/wBcWc/8/

Answer 1

你最好不要使用<p>标签，因为它们包含默认边距。您可以更轻松地使用带有类的平原<span>。使用line-height:100px(same as height) 和 text-align:center;将文本水平和垂直居中。

jsFiddle

HTML

<span class="wrapper">
    <div class="rowone" class="a"><span class="hoverable">test</span></div>
    ...

CSS

div {
    text-align:center;
    line-height:100px;
}
.hoverable{
   color:transparent;    
}
.hoverable:hover{
    color:red;
    text-align:center;
}