cari

Rumah  >  Artikel  >  hujung hadapan web  >  Tetapkan kesan bayangan menggunakan CSS

Tetapkan kesan bayangan menggunakan CSS

WBOY
WBOYke hadapan
2023-09-01 18:33:021161semak imbas

使用 CSS 设置阴影效果

Drop Shadow mencipta bayang-bayang objek pada ofset dan warna X (mendatar) dan Y (menegak) yang ditentukan.

Parameter berikut tersedia dalam penapis ini:

teduh. offXoffYBilangan piksel bayang-bayang diimbangi daripada objek visual di sepanjang paksi-y. Integer positif menggerakkan bayang-bayang ke bawah, integer negatif menggerakkan bayang-bayang ke atas. positifJika benar, semua piksel legap objek mempunyai bayang-bayang. Jika palsu, semua piksel lutsinar mempunyai bayang-bayang. Lalai kepada benar.
Parameter

Penerangan
dalam format #RR, Warna

Bilangan piksel unjuran diimbangi daripada objek visual di sepanjang paksi-x. Integer positif menggerakkan unjuran ke kanan, integer negatif menggerakkan unjuran ke kiri.

Contoh

Anda boleh cuba jalankan kod berikut untuk menyediakan kesan drop shadow:

Live Demo

<html>
   <head></head>
   <body>
      <img src = "/css/images/logo.png"
         alt = "CSS Logo"
         style = "Filter: Chroma(Color = #000000)
         DropShadow(Color = #FF0000,
         OffX = 2,
         OffY = 2, Positive = 1)">
      <p>Text Example:</p>
      <div style = "width: 357;
         height: 50;
         font-size: 30pt;
         font-family: Arial Black;
         color: red;
         Filter: DropShadow(Color = #000000, OffX = 2, OffY = 2, Positive = 1)">CSS Tutorials</div>
   </body>
</html>

Atas ialah kandungan terperinci Tetapkan kesan bayangan menggunakan CSS. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan：
Artikel ini dikembalikan pada:tutorialspoint.com. Jika ada pelanggaran, sila hubungi admin@php.cn Padam
Artikel sebelumnya：Apa yang anda perlu tahu tentang tapak web responsif?Artikel seterusnya：Apa yang anda perlu tahu tentang tapak web responsif?

Artikel berkaitan

Lihat lagi