Properti css "transparansi" - cara sederhana untuk membuat desain website yang menarik

Hari ini, penciptaan desain website menjadi seni yang nyata.Hal ini tidak hanya satu set halaman warna tertentu dan ukuran, font, gaya yang berbeda dan tema gambar.Untuk membuat sebuah situs web yang berbeda dari orang lain, untuk menarik perhatian pengunjung dan mengirimkannya ke mereka atau elemen lain yang menggunakan sejumlah besar metode dan alat.Di antara mereka ada css properti yang sangat populer - transparansi.Teknik ini cukup modis dan glamor, dan karena itu sering digunakan.Anda dapat memberikan transparansi berbagai objek halaman - teks, gambar, atau seluruh unit, misalnya.Hal ini juga dapat dicapai dengan cara yang berbeda.Mari kita memeriksa mereka di bawah ini.Parameter

untuk mengatur transparansi elemen parameter

memungkinkan untuk mengatur transparansi elemen beberapa.Mereka digunakan tergantung pada tujuan tertentu, dan browser, yang berada di bawah "disesuaikan" desain.Ini termasuk sifat sebagai berikut:

• opacity;
• filter;
• PNG-gambar sebagai latar belakang.

nilai properti css "transparansi" berubah sebagai berikut: jumlah, semakin rendah tingkat transparansi elemen yang lebih tinggi.Opacity itu bervariasi dari 0 ke 1, di filter - dari 10 sampai 100. Dan yang terakhir digunakan untuk browser Interet Explorer, dan untuk semua properti lain yang berlaku adalah opacity.

Transparansi gambar (mengubah)

dimulai dengan pilihan ketika transparansi akan memanifestasikan dirinya ketika Anda memindahkan kursor mouse ke item.

mempertimbangkan bagaimana untuk mengatur transparansi gambar.CSS menawarkan dua pilihan.Untuk melakukan ini, Anda harus mendaftar dalam kode html-dokumen sebagai berikut:

1. Tentukan path ke gambar.
2. mendefinisikan parameter transparansi ketika kursor tidak.Untuk ini kita menggunakan properti onmouseover dan onmouseout, yang mengatur nilai opacity dan filter.

karakteristik ini dapat ditentukan dalam css-dokumen dan kode sumber untuk menambahkan link untuk itu.Hasil berubah sama.

blok teks transparan dan halaman

Adapun teks atau blok (div transparan), css menawarkan opsi, mirip dengan menciptakan citra transparan, yang digunakan terhubung css-file, yang akan diberikan parameter yang diperlukan.Anda dapat pergi dan cara yang lebih sederhana.Ketika Anda menetapkan gaya blok div style atau teks p meresepkan elemen html-kode berikut untuk onmouseover dan onmouseout.Kedua pilihan bekerja dan memberikan hasil yang diinginkan.

Transparansi

Dalam beberapa kasus, transparansi objek, elemen desain atau teks yang ingin mengatur secara berkelanjutan.Dalam situasi ini, solusinya adalah lebih sederhana dibandingkan dengan mouse.

elemen css untuk transparansi akan diberikan kode berikut.Dalam blok div style meresepkan nilai untuk latar belakang (misalnya, # ff8800), opacity (misalnya, 0,5) dan lebar (lebar) dan padding (padding).

untuk gambar dalam kode membuat nilai-nilai dan opacity filter, dan menentukan path ke gambar.

RGBA-metode

Ada pilihan lain untuk menggunakan css properti ini: transparansi dapat diterapkan untuk warna latar belakang dari elemen desain.Ia menggunakan metode RGBA.Tiga huruf pertama mewakili warna dasar (merah, fisi, biru), dan yang terakhir - alpha, yang menetapkan tingkat transparansi.Menggunakan RGBA format mengatur transparansi, menunjuk ke angka terakhir.Misalnya, seperti: background: RGBA (240,2,33,0.4035).

Kesimpulan

demikian, menggunakan dalam program kerja pada desain situs sederhana namun properti spektakuler css "transparansi", Anda dapat membuatnya lebih menarik dan unsur sedikit usaha lebih terlihat.Dijelaskan transparansi kinerja pekerjaan perwujudan akan membantu Anda dengan ini.