Matn soyasi
CSS matn soyasi
text-shadow xossasi matnga soya qo‘shadi.
Eng oddiy ishlatishda faqat gorizontal va vertikal soyani ko‘rsatasiz.
Bundan tashqari, soya rangi va xira (blur) effektini qo‘shishingiz mumkin.
Matn soya effekti!
Keyin soyaga rang (qizil) qo‘shing:
Matn soya effekti!
Misol
Gorizontal va vertikal soya, rang bilan:
h1
{
text-shadow: 2px 2px red;
}
O‘zingiz sinab ko‘ring »
So‘ng soyaga xiralik (blur) effekti (5px) qo‘shing:
Matn soya effekti!
Misol
Gorizontal va vertikal soya, rang va xira effekti bilan:
h1
{
text-shadow: 2px 2px 5px red;
}
O‘zingiz sinab ko‘ring »
CSS More Text Shadow misollari
Matn soya effekti!
Misol
Oq matnga text-shadow:
h1 {
color: white;
text-shadow: 2px 2px 4px #000000;
}
O‘zingiz sinab ko‘ring »
Matn soya effekti!
Misol
Qizil neon yorug‘lik bilan text-shadow:
h1 {
text-shadow: 0 0 3px #ff0000;
}
O‘zingiz sinab ko‘ring »
Bir nechta soyalar
text-shadow xossasi element uchun bir nechta soyani ham qabul qiladi. Har bir soyani vergul bilan ajratilgan ro‘yxatda belgilang.
Quyidagi misol qizil va ko‘k neon yorug‘lik soyasini ko‘rsatadi:
Matn soya effekti!
Misol
Qizil va ko‘k neon yorug‘lik bilan text-shadow:
h1 {
text-shadow: 0 0 3px #ff0000, 0 0 5px #0000ff;
}
O‘zingiz sinab ko‘ring »
Quyidagi misol qora, ko‘k va qizil neon yorug‘likli oq matnni ko‘rsatadi:
Matn soya effekti!
Misol
Qora, ko‘k va qizil neon yorug‘lik bilan text-shadow:
h1 {
color: white;
text-shadow: 1px 1px 2px black, 0 0 25px blue, 0
0 5px red;
}
O‘zingiz sinab ko‘ring »
Maslahat: Shriftlarni, matn o‘lchamini va matn uslubini qanday o‘zgartirishni o‘rganish uchun bizning CSS Fonts bobimizga o‘ting.
Maslahat: Turli matn effektlari haqida bilib olish uchun bizning CSS Text Effects bobimizga o‘ting.
CSS text-shadow xossasi
| Xususiyat | Tavsif |
|---|---|
| text-shadow | Matnga qo‘shilgan soya effektini belgilaydi |
W3Schools Pathfinder
Yutuqlaringizni kuzating – bu bepul!