Bagaimanakah Saya Boleh Menjadikan Latar Belakang Div Legap Tanpa Menjejaskan Teksnya?-tutorial css-php.cn

Rumah

hujung hadapan web

tutorial css

Bagaimanakah Saya Boleh Menjadikan Latar Belakang Div Legap Tanpa Menjejaskan Teksnya?

Mary-Kate Olsen

Dec 17, 2024 pm 06:35 PM

How Can I Make a Div's Background Opaque Without Affecting its Text?

Kelegapan CSS untuk Warna Latar Belakang Sahaja, Tetapi Bukan Teks

Masalah:

Adakah mungkin untuk menetapkan sifat kelegapan eksklusif untuk latar belakang div, tanpa menjejaskan teks di dalamnya ia?

Percubaan Awal:

Kod berikut telah dicuba:

background: #CCC;
opacity: 0.6;

Walau bagaimanapun, kaedah ini gagal mengubah suai kelegapan latar belakang.

Penyelesaian:

Untuk mencipta latar belakang lutsinar sambil membiarkan teks tidak terjejas, pertimbangkan untuk menggunakan fungsi rgba():

background: rgba(R, G, B, A);

Fungsi rgba(). Sintaks:

R, G, B: Integer atau peratusan yang mewakili nilai merah, hijau dan biru.
A: Nilai alfa antara 0 dan 1 atau peratusan, dengan 1 mewakili penuh kelegapan.

Contoh:

background: rgba(51, 170, 51, 0.4);

Kod ini mencipta latar belakang yang 40% legap dengan warna hijau.

Keserasian Pelayar:

Sehingga 2018, hampir setiap penyemak imbas moden menyokong sintaks rgba().

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Menjadikan Latar Belakang Div Legap Tanpa Menjejaskan Teksnya?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan

Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn

Artikel Berkaitan

Draggin ' dan Droppin ' dalam ReactApr 17, 2025 am 11:52 AM

Ekosistem React menawarkan kita banyak perpustakaan yang semuanya memberi tumpuan kepada interaksi seret dan penurunan. Kami mempunyai React-Dnd, React-Beautiful-Dnd,

Perisian CepatApr 17, 2025 am 11:49 AM

Terdapat beberapa perkara yang saling berkaitan dengan perisian cepat sejak kebelakangan ini.

Kecerunan bersarang dengan klip latar belakangApr 17, 2025 am 11:47 AM

Saya tidak boleh mengatakan saya menggunakan klip latar belakang semua yang kerap. Saya ' Tetapi saya diingatkan dalam jawatan oleh Stefan Judis,

Menggunakan RequestAnimationFrame dengan cangkuk ReactApr 17, 2025 am 11:46 AM

Animasi dengan RequestAnimationFrame semestinya mudah, tetapi jika anda belum membaca dokumentasi React dengan teliti maka anda mungkin akan mengalami beberapa perkara

Perlu tatal ke bahagian atas halaman?Apr 17, 2025 am 11:45 AM

Mungkin cara paling mudah untuk menawarkan kepada pengguna adalah pautan yang mensasarkan ID pada elemen. Begitu seperti ...

API terbaik (graphql) adalah salah satu yang anda tulisApr 17, 2025 am 11:36 AM

Dengar, saya bukan pakar GraphQL tetapi saya suka bekerja dengannya. Cara ia mendedahkan data kepada saya sebagai pemaju front-end cukup sejuk. Ia seperti menu

Berita Platform Mingguan: Bookmarket Jarak Teks, Menunggu Tahap Teratas, Penunjuk Memuatkan AMP BaruApr 17, 2025 am 11:26 AM

Pada minggu ini, roundup, sebuah bookmarklet yang berguna untuk memeriksa tipografi, menggunakan menunggu untuk mengamuk dengan cara modul JavaScript mengimport satu sama lain, ditambah Facebook ' s

Pelbagai kaedah untuk mengembangkan kotak semasa memelihara jejari sempadanApr 17, 2025 am 11:19 AM

Saya baru -baru ini melihat perubahan yang menarik pada Codepen: apabila melayang pena di laman web, ada persegi panjang dengan sudut bulat yang berkembang di belakang.

See all articles