Как да прехвърлите свойствата на CSS „display“ + „opacity“.

Стъпка 2: Задайте свойството „дисплей“.

След това влезте в контейнера div, като използвате името на класа „ основен артикул ” и задайте „ дисплей ' Имот:

Тук стойността на „ дисплей ” свойството е зададено като „ блок ” за заемане на цялата ширина на екрана.

Стъпка 3: Добавете фоново изображение

След това приложете следните CSS свойства към отворения div контейнер:

В горепосочения кодов фрагмент:

• “ височина ' и ' ширина ” свойства определят размера на дефинирания елемент.
• “ фоново изображение ” CSS свойството се използва за вмъкване на изображение с помощта на „ url() ” от задната страна на елемента.
• “ непрозрачност ” определя нивото на непрозрачност за даден елемент. Нивото на непрозрачност показва нивото на прозрачност, където „ 1 ” се използва за липса на прозрачност и „ 0,5 ' е за ' петдесет% ” прозрачност.
• “ преход ” в CSS позволява на потребителите да променят плавно стойностите на свойствата за определен период от време.
• “ марж ” дефинира пространството извън дефинираната граница около елемент.

Изход

Стъпка 4: Приложете „:hover“ псевдоселектор

Сега отворете div контейнера по „ :задръжте ” псевдо селектор, който се използва за избиране на елементи, когато задържим мишката върху тях:

След това задайте „ непрозрачност ” на избрания елемент като „ 1 ”, за да премахнете прозрачността.

Изход

Това е всичко относно настройката на свойствата „display“ и „opacity“ на CSS за преход.

Заключение

За да зададете свойствата на прехода „display“ и „opacity“, първо направете div контейнер, като използвате елемента