Овај пост објашњава метод за постављање прелаза уз помоћ ЦСС-а “ приказ ' и ' непрозирност ” Својства.
Како пренети ЦСС својства „приказ“ и „прозирност“?
За прелазак ЦСС-а “ приказ ' и ' непрозирност ” својства, прво, направите див контејнер са „ <див> ” елемент. Затим приступите див контејнеру и додајте слику у позадини уз помоћ „ позадинска слика ' имовина. Након тога, поставите „ прелаз ”, “ непрозирност “ и друге потребне особине по вашем избору.
Корак 1: Направите „див“ контејнер
У почетку направите див контејнер уз помоћ „ <див> ” и додајте атрибут класе са одређеним именом. Да бисмо то урадили, поставили смо име класе као „ предмет ”:
<див цласс = 'главна ставка' > >
Корак 2: Подесите својство „приказ“.
Затим приступите див контејнеру користећи назив класе “ главна-ставка ” и подесите „ приказ ' имовина:
.главни предмет {
приказ : блокирати ;
}
Овде је вредност „ приказ ” својство је постављено као “ блокирати ” за заузимање целе ширине екрана.
Корак 3: Додајте слику у позадини
Затим примените следећа ЦСС својства на див контејнер којем се приступа:
.главни предмет {висина : 400пк ;
ширина : 400пк ;
позадинска слика : урл ( спринг-фловерс.јпг ) ;
непрозирност : 0.1 ;
прелаз : непрозирност 2с лакоћа уласка ;
маргина : 30пк 50пк ;
}
У горе наведеном исечку кода:
- “ висина ' и ' ширина ” својства одређују величину дефинисаног елемента.
- “ позадинска слика ” ЦСС својство се користи за уметање слике уз помоћ „ урл() ” функција на задњој страни елемента.
- “ непрозирност ” одређује ниво непрозирности за елемент. Ниво непрозирности показује ниво транспарентности, где „ 1 ” се користи за нетранспарентност, а „ 0.5 ” је за “ педесет% ” транспарентност.
- “ прелаз ” у ЦСС-у омогућава корисницима да глатко мењају вредности својстава током датог трајања.
- “ маргина ” дефинише простор изван дефинисане границе око елемента.
Излаз
Корак 4: Примените „:ховер“ псеудо селектор
Сада приступите див контејнеру дуж „ :лебдети ” псеудо селектор који се користи за одабир елемената када пређемо мишем преко њих:
.главни предмет : лебдети {непрозирност : 1 ;
}
Затим поставите „ непрозирност ” изабраног елемента као „ 1 ” да бисте уклонили провидност.
Излаз
То је све о подешавању прелазних ЦСС својстава „приказ“ и „прозирност“.
Закључак
Да бисте поставили својства „приказ“ и „прозирност“ прелаза, прво направите див контејнер помоћу елемента <див>. Затим приступите елементу див и поставите „ приказ ' као ' блокирати ”. Након тога, примените друга ЦСС својства, укључујући „ позадинска слика ” да бисте уметнули слику у контејнер, „прелаз”, „прозирност” и друго. Овај пост је објаснио метод за постављање транзиције помоћу ЦСС-а “ приказ ' и ' непрозирност ” својства.