Bagaimana untuk melaksanakan bayangan dalaman teks?
不言
不言 2018-10-23 17:28:03
0
1
1063

Bolehkah bayangan teks direalisasikan dengan bayangan teks Jadi bagaimana untuk memaparkan bayangan dalaman teks?

不言
不言

membalas semua (1)
不言

Intinya ialah menggunakan warna lutsinar RGBA untuk mensimulasikan kesan bayangan dalaman fon.

body{ background:#fff; } .inset-text{ font-family:Helvetica,Arial,sans-serif; font-weight:bold; font-size:5em; color:rgba(0,102,204,0.7); text-shadow:1px 3px 6px #fff,0 0 0 #000,1px 3px 6px #fff; }

Prinsipnya sangat mudah, bayang teks sentiasa berada di bawah fon, jadi gunakan berbilang bayang-bayang teks untuk mula-mula mensimulasikan kesan bayang-bayang terbenam di bawah warna pepejal fon, dan kemudian, dengan mengurangkan ketelusan daripada fon, kesan fon ialah Kesan simulasi bayang-bayang dalam. Sememangnya simulasi sebegini ada batasan Contohnya warna latar belakang dan bayangan simulasi mesti sama, jika tidak ia akan mengelirukan, haha. Kedua, ia tidak akan berfungsi dalam pelayar yang tidak menyokong RGBA, dan warna lalai mesti ditambah di atas RGBA untuk memastikan penyemak imbas lama sekurang-kurangnya boleh memaparkan warna pepejal:

.inset-text{ font-family:Helvetica,Arial,sans-serif; font-weight:bold; font-size:5em; color:#09f; color:rgba(0,102,204,0.7); text-shadow:1px 3px 6px #fff,0 0 0 #000,1px 3px 6px #fff; }

Akhir sekali, jika anda memilih teks dalam contoh di atas, Anda boleh melihat kekaburan yang jelas. Ini juga telah disebut sebelum ini, kerana kesan berbilang bayang masih berkesan apabila dipilih, jadi untuk kebolehbacaan teks, bayang teks apabila dipilih harus dialih keluar.

rreeee
    Muat turun terkini
    Lagi>
    kesan web
    Kod sumber laman web
    Bahan laman web
    Templat hujung hadapan
    Tentang kita Penafian Sitemap
    Laman web PHP Cina:Latihan PHP dalam talian kebajikan awam,Bantu pelajar PHP berkembang dengan cepat!