Cara Peralihan Ciri 'paparan' + 'kelegapan' CSS

Cara Peralihan Ciri Paparan Kelegapan Css



Dalam CSS, peralihan merujuk kepada kaedah untuk mengawal kelajuan elemen tambahan sambil menggunakan sifat CSS padanya. Lebih khusus lagi, anda boleh melakukan pelbagai peralihan, termasuk peralihan halaman, peralihan imej, teks dan banyak lagi. Anda boleh menentukan perubahan yang akan digunakan selepas tempoh masa tertentu, berbanding perubahan hartanah berkuat kuasa serta-merta.

Siaran ini menerangkan kaedah untuk menetapkan peralihan dengan bantuan CSS ' paparan ” dan “ kelegapan ” Hartanah.

Bagaimana untuk Mengalihkan Ciri 'paparan' dan 'kelegapan' CSS?

Untuk mengalihkan CSS ' paparan ” dan “ kelegapan sifat ', pertama, buat bekas div dengan '

” unsur. Kemudian, akses bekas div dan tambahkan imej latar belakang dengan bantuan ' imej latar belakang ” harta benda. Selepas itu, tetapkan ' peralihan ”, “ kelegapan ”, dan hartanah lain yang diperlukan mengikut pilihan anda.





Langkah 1: Buat Bekas 'div'.

Pada mulanya, buat bekas div dengan bantuan '

” bekas dan tambah atribut kelas dengan nama tertentu. Untuk berbuat demikian, kami telah menetapkan nama kelas sebagai “ item ”:



= 'item utama' > >

Langkah 2: Tetapkan Harta 'paparan'.

Seterusnya, akses bekas div dengan menggunakan nama kelas ' item utama ” dan tetapkan “ paparan ” harta:



.item utama {

paparan : blok ;

}

Di sini, nilai ' paparan ” harta ditetapkan sebagai “ blok ” untuk mengambil semua lebar skrin.



Langkah 3: Tambah Imej Latar Belakang

Seterusnya, gunakan sifat CSS berikut pada bekas div yang diakses:

.item utama {

ketinggian : 400px ;

lebar : 400px ;

imej latar belakang : url ( spring-flowers.jpg ) ;

kelegapan : 0.1 ;

peralihan : kelegapan 2s kemudahan masuk-keluar ;

margin : 30px 50px ;

}

Dalam coretan kod yang dinyatakan di atas:



  • “ ketinggian ” dan “ lebar ” sifat menentukan saiz elemen yang ditentukan.
  • “ imej latar belakang ” Harta CSS digunakan untuk memasukkan imej dengan bantuan “ url() ” fungsi di bahagian belakang elemen.
  • “ kelegapan ” menentukan tahap kelegapan untuk unsur. Tahap kelegapan menunjukkan tahap ketelusan, di mana “ 1 ' digunakan tanpa ketelusan, dan ' 0.5 ' adalah untuk ' lima puluh% ” ketelusan.
  • “ peralihan ” dalam CSS membenarkan pengguna menukar nilai hartanah dengan lancar dalam tempoh tertentu.
  • “ margin ” mentakrifkan ruang di luar sempadan yang ditentukan di sekeliling unsur.

Pengeluaran

Langkah 4: Gunakan Pemilih Pseudo “:hover”.

Sekarang, akses bekas div di sepanjang ' : berlegar ” pemilih pseudo yang digunakan untuk memilih elemen apabila kita mengarahkan tetikus di atasnya:

.item utama : berlegar {

kelegapan : 1 ;

}

Kemudian, tetapkan ' kelegapan ” daripada elemen yang dipilih sebagai “ 1 ” untuk menghapuskan ketelusan.

Pengeluaran

Itu sahaja tentang menetapkan peralihan CSS sifat 'paparan' dan 'kelegapan'.

Kesimpulan

Untuk menetapkan sifat peralihan 'paparan' dan 'kelegapan', mula-mula buat bekas div menggunakan elemen

. Seterusnya, akses elemen div dan tetapkan “ paparan 'sebagai' blok ”. Selepas itu, gunakan sifat CSS yang lain, termasuk ' imej latar belakang ” untuk memasukkan imej dalam bekas, “peralihan”, “kelegapan” dan lain-lain. Siaran ini menerangkan kaedah untuk menetapkan peralihan dengan CSS ' paparan ” dan “ kelegapan ” hartanah.

Lain-lain

Kategori

Jawatan Popular

Bagaimana untuk Mengakses Penjadual Tugas pada Windows 10?

Bagaimana untuk Meluluskan Argumen kepada Fungsi dalam C++: Mengikut Nilai vs. Mengikut Rujukan?

Apakah kata kunci julat dalam Golang

Python Tiada Kata Kunci

Cara Memasang Oracle Java Development Kit (JDK) pada Debian 12

Bagaimana untuk mematikan Pemberitahuan Kemas Kini Java Menjengkelkan dalam Windows?

Cara Memasang C# pada Linux

Cara Pasang ke Java dalam Windows 11

Bagaimana Windows Defender 'Block at First Sight' Ciri Perlindungan Awan berfungsi? - Winhelponline

Cara Mendapatkan ID Anchor Di Dalam Item Senarai dalam JavaScript

Bagaimana untuk menyertai Discord Fortnite Server

Apakah Menara Kawalan AWS dan Cara Menggunakannya?

Cara Mengisytiharkan Pembolehubah dalam C

Perintah Editor Vim Asas

Cara Menggunakan Fungsi Math.Round() dalam C#

Cara Melaksanakan Kerja pada Raspberry Pi

Bagaimana Memaksa Memadam Fail yang Tidak Boleh Dipadamkan pada Windows 11?

Fungsi MySQL Round().

Cara Memasang Dropbox pada Fedora Linux

Cara Mengira Aksara dalam Rentetan dengan strcspn() dalam Pengaturcaraan C