CSSの「display」+「opacity」プロパティを遷移させる方法

ステップ 2: 「display」プロパティを設定する

次に、クラス名「 メインアイテム 」を設定し、「 画面 ' 財産：

ここで、「 画面 」プロパティは「 ブロック 」画面幅をすべて占有します。

ステップ 3: 背景画像を追加する

次に、アクセスした div コンテナーに次の CSS プロパティを適用します。

上記のコード スニペットでは、次のようになります。

• 「 身長 ' と ' 幅 」プロパティは、定義された要素のサイズを決定します。
• 「 背景画像 」 CSS プロパティは、「 URL() 」要素の裏側で機能します。
• 「 不透明度 」は要素の不透明度を決定します。不透明度レベルは、透明度レベルを示します。 1 」は透過性がない場合に使用され、「 0.5 」は「 50% 透明感。
• 「 遷移 」を CSS で使用すると、ユーザーは特定の期間にわたってプロパティ値をスムーズに変更できます。
• 「 マージン 」は、要素の周囲に定義された境界の外側のスペースを定義します。

出力

ステップ 4: 「:hover」疑似セレクターを適用する

次に、「 :ホバー 」 マウスを要素の上に置いたときに要素を選択するために使用される疑似セレクター:

次に、「 不透明度 」を選択した要素の「 1 」で透明度を取り除きます。

出力

トランジション CSS の「表示」および「不透明度」プロパティの設定は以上です。

結論

トランジションの「display」と「opacity」プロパティを設定するには、まず