jquery - いくつかの質問（バウンス、整列）

Question

真ん中の円のテキストを揃えて、円をホバーしたときにバウンスさせようとしています（つまりテキスト）

ここにあります：

誰かが助けてくれることを願っています

デンバー

score 0 · Accepted Answer

要素内の1行のテキストを垂直方向に中央揃えにする最も簡単な方法は、「line-height」を要素の「height」に一致させることです。したがって、この場合は次のようになります。

.circ {
    line-height: 200px;
}

次に、テキストをバウンスさせるには、アニメーションを使用して「行の高さ」を変更するだけです。

.circ:hover {
    animation: bounce .5s ease-in-out infinite;
}
@keyframes bounce {
    50% { line-height: 175px; }
}

動作するデモは次のとおりです：http：//jsfiddle.net/joshnh/Cvjsu/

1 に答える 1