CSS Text Shadow

Matn Soyasi

text-shadow xususiyati matnga soyani qo'shadi.

Eng oddiy holatda, faqat gorizontal soyani (2px) va vertikal soyani (2px) belgilaysiz:

Matn soyasi effekti!

Misol

h1 {
  text-shadow: 2px 2px;
}

Keyin, soyaga rang (qizil) qo'shasiz:

Matn soyasi effekti!

Misol

h1 {
  text-shadow: 2px 2px red;
}

So'ngra, soyaga xiralashgan effekt (5px) qo'shasiz:

Matn soyasi effekti!

Misol

h1 {
  text-shadow: 2px 2px 5px red;
}

Matn Soyasi uchun Qo'shimcha Misollar

Misol 1

Oq matndagi matn soyasi:

h1 {
  color: white;
  text-shadow: 2px 2px 4px #000000;
}

Misol 2

Qizil neon nuri bilan matn soyasi:

h1 {
  text-shadow: 0 0 3px #ff0000;
}

Misol 3

Qizil va ko'k neon nuri bilan matn soyasi:

h1 {
  text-shadow:
    0 0 3px #ff0000,
    0 0 5px #0000ff;
}

Misol 4

h1 {
  color: white;
  text-shadow:
    1px 1px 2px black,
    0 0 25px blue,
    0 0 5px darkblue;
}

Maslahat: Shrift, matn hajmi va matn uslubi haqida o'rganish uchun CSS Fonts bo'limiga o'ting.

Maslahat: Turli matn effektlari haqida o'rganish uchun CSS Text Effects bo'limiga o'ting.

CSS Matn Soyasi Xususiyati