Mulk css "oshkoralik" - sayt yanada qiziqarli dizayn qilish uchun oddiy yo'l

Bugungi kunda, veb-sayt dizayni yaratish san'at shakli aylanadi. Bu ma'lum bir rangi va sahifa elementlar faqat bir to'siq emas hajmi, shriftlar , turli uslublar va anik rasmlari. , Boshqalardan sizning sayt turli qilish Saytga e'tiborini jalb etish va muayyan elementlar to'g'rilab maqsadida, usullari va vositalari katta qator ishlatiladi. Ular orasida juda mashhur mulk CSS bor - oshkoralik. Bu usul ancha zamonaviy va jozibali bo'lib, shuning uchun tez-tez ishlatiladi. Misol uchun matn blok, yoki butun rasm, - Transparency sayt turli ob'ektlar sahifalarni berishi mumkin. Bu, shuningdek, turli xil yo'llar bilan erishish. AQSh quyida ularni ko'rib chiqamiz.

Parameters oshkoralik elementlarini ko'rsating

Parameters bir necha elementlarni oshkoraligini tartibga solish. Ular: «yo'lga" dizayn ostida brauzer, shuningdek, muayyan maqsadlarga qarab ishlatiladi. Bu quyidagi xususiyatlarini o'z ichiga oladi:

• qorong'i;
• filtri;
• bir fon sifatida PNG-tasvir.

quyidagicha mulk qiymati CSS "oshkoralik" o'zgartirildi: oliy sonini, elementning oshkoralik quyi darajada. 10 dan 100 uchun va ikkinchisi Interet Explorer brauzeri, va boshqa barcha amal qorong'i mulkka uchun ishlatiladi - qorong'i, u filtr yilda, 0 dan 1 o'zgaradi.

Transparency Image (o'zgartirish)

Siz ob'ektni ko'chirish qachon shaffof paydo bo'ladi variantlari bilan yarataylik sichqoncha sudrab tomonidan.

AQSh tasvir shaffofligini belgilash uchun qanday qilib ko'rib chiqaylik. CSS ikkita variant taklif etadi. quyidagicha Buning uchun siz kodi HTML-hujjatda uni to'g'ridan-to'g'ri ro'yxatdan kerak:

1. tasvir uchun yo'lni ko'rsating.
2. kursor emas, biz oshkoralik parametrlarini aniqlash. Buning uchun, biz qorong'i va filtr qiymatini nazarda tutilgan onMouseOver va onmouseout, xususiyatlariga foydalaning.

Shu xususiyatlari CSS-hujjatni va unga bir mos yozuvlar kiritish uchun manba Kodeksda nazarda tutilgan bo'lishi mumkin. natijalar Shu chiqib o'girib.

Matn va sahifa bloklar Transparency

matn yoki blokda (shaffof div) uchun, CSS shaffof rasmni yaratish o'xshash o'z variantni taklif etadi, deb, kerakli parametrlar o'rnatiladi qaysi bog'liq CSS-fayli, foydalanish kerak. Siz borish va oddiy yo'l mumkin. Siz uslublar blok div xohishlarini o'rnatish yoki matn p uchun onMouseOver va elementlar onmouseout quyidagi HTML-kod buyurmoq qachon. Har ikki imkoniyatlari ishlash va kerakli natijaga ishlab chiqarish.

oshkoralik doimiy

Ba'zi hollarda, bir ob'ekt oshkoralik, siz doimiy ravishda belgilash uchun kerakli bo'lgan dizayn element yoki matn. Bu vaziyatda, eritma sichqoncha kursorini olib kelib ham oddiy.

oshkoralik uchun CSS element quyidagi kodni tomonidan beriladi. blok div uslubi fon (masalan, # ff8800), xiralik (masalan, 0,5) va eni (kengligi) va plomba (padding) qiymatlari buyurish.

tasvir uchun kod qadriyatlar qilish va qorong'i filtri va tasvir uchun yo'lni ko'rsating etiladi.

RGBA-usul

oshkoralik har qanday dizayn element bazasi rangi qo'llanilishi mumkin: bu xususiyat CSS foydalanish uchun boshqa variantlar ham bor. Bu RGBA usuli foydalanadi. oshkoralik darajasini belgilaydi alfa, - birinchi uchta harf asosiy ranglar (qizil, bo'linish, ko'k), va oxirgi tarafdorimiz. RGBA-formatini foydalanish oxirgi raqami, uni ko'rsatib, oshkoralikni nazarda tutilgan. Misol uchun, deb: fon: RGBA (240,2,33,0.4035).

xulosa

Shunday qilib, sayt dizayni oddiy, ammo samarali xususiyati CSS "oshkoralik" kuni ish jarayonida foydalanib, siz kam intilishlar bilan elementlari yanada qiziqarli va yanada sezilarli qilish mumkin. tasvirlangan va mexanizmlar Custom oshkoralik xususiyatlari, bu bilan sizga yordam beradi bo'ladi.