0

これはデモです:デモ デモは Webkit ブラウザ (chrome または safari) でのみ動作します。

4つのボックスがあり、それぞれにタイトルがあります。ユーザーがクリックして div を展開したとき。divが展開されます。最初はタイトルは左にありますが、div が展開されると、アニメーションでタイトルを中央に移動する必要があります。タイトルが適切に中央揃えになるように変更されました。コードを見てください。理解が深まります。

4

1 に答える 1

1

パディングを削除し、タイトルをh3の中央に配置して、タイトルの幅をautoと100％の間でアニメーション化してみてください。nowrapを使用して、タイトルが1行に収まるようにします。

h3 {
  text-align: center;
  width: auto;
  white-space: nowrap;
  ...
}

次に、にアニメートします

.expand h3 {
  width: 100%;
}
于 2012-10-15T15:03:21.773 に答える