css - 単一行および複数行のテキストを中央揃えにする方法

Question

写真に示すように、

テキストが 1 行の場合、テキストは垂直方向に中央揃えになります。 テキストが 2 行ある場合、テキストも垂直方向に中央揃えになります。

追記: 体を曲げる必要はありません。

Answer 1

最初にレンダリングを見てください

次にコードの実装です

リーリー

Answer 2

レイアウトから判断すると、次のようになります。左側のテキストと右側の時刻が両方とも垂直方向の中央に配置されます。
簡単な方法は次のとおりです:
layout:<p><span>gfghghg</span><span>2017-12<s/pan></p>
css:
p{display:table ;}
スパン{表示: テーブルセル; 垂直方向に配置: 中央;}

お試しいただけます

Answer 3

さまざまなソリューションとポータルが含まれています

Answer 4

リーリー

Answer 5

<p class="" style="display: table;height: 100px;">

リーリー

Answer 6

リーリー リーリー

Answer 7

あなたが提供した図によると、各コンテンツの高さは固定されているため、最も外側の親要素の行の高さを独自の高さでのpタグの表示に設定します。コード構造
リーリー

Answer 8

私がまとめたこれらの方法をご覧ください。ポータル
被験者が必要としているのは、複数行のテキストを垂直方向に中央揃えにする方法です。私がまとめた記事には、これを実現するための代表的な方法が含まれています。例は次のとおりです。
http://codepen.io/zengkan0703...
私の回答が気に入らなかったのは質問者さんだったのでしょうか？もしそうなら、その理由を答えていただければ幸いです。そうでない場合は、上記の例でニーズが解決されるはずです。