CSS funksiyalari
CSS funksiyalari
CSS funksiyalaridan qiymatlarni hisoblash, stringlar yoki ranglar ustida amallar bajarish, murakkab gradientlar va shakllar yaratish va boshqa ko‘p narsalar uchun foydalanish mumkin.
CSS funksiyalari odatda turli CSS xususiyatlari uchun qiymat sifatida ishlatiladi.
| Funksiya | Tavsif |
|---|---|
| acos() | -1 va 1 oralig‘idagi sonning arkkosinusini qaytaradi |
| asin() | -1 va 1 oralig‘idagi sonning arksinusini qaytaradi |
| atan() | -∞ va ∞ oralig‘idagi sonning arktangensini qaytaradi |
| atan2() | -cheksizlik va cheksizlik oralig‘idagi ikki qiymatning arktangensini qaytaradi |
| attr() | Tanlangan element atributining qiymatini qaytaradi |
| blur() | Elementga xiralashtirish (blur) effektini qo‘llaydi |
| brightness() | Elementning yorqinligini sozlaydi (yorqinroq yoki qorong‘iroq) |
| calc() | CSS xususiyat qiymatlarini aniqlash uchun hisob-kitoblarni bajarish imkonini beradi |
| circle() | Aylanani belgilaydi |
| clamp() | Ko‘rish maydoni (viewport) o‘lchamiga qarab minimal va maksimal qiymat oralig‘ida moslashuvchan o‘zgaradigan qiymatni o‘rnatadi |
| color() | Rangni muayyan, ko‘rsatilgan rang fazosida belgilash imkonini beradi |
| color-mix() | Ikki rang qiymatini berilgan rang fazosida berilgan miqdorda aralashtiradi |
| conic-gradient() | Konik gradient yaratadi |
| contrast() | Elementning kontrastini sozlaydi |
| cos() | Burchak kosinusini qaytaradi |
| counter() | Nomlangan hisoblagichning joriy qiymatini qaytaradi |
| counters() | Nomlangan va ichma-ich joylashgan hisoblagichlarning joriy qiymatlarini qaytaradi |
| cubic-bezier() | Kubik Bezye egri chizig‘ini belgilaydi |
| drop-shadow() | Rasmga tushuvchi soya (drop shadow) effektini qo‘llaydi |
| ellipse() | Ellipsni belgilaydi |
| exp() | E ning ko‘rsatilgan x soni darajasini qaytaradi (Ex) |
| fit-content() | Elementga uning kontentiga qarab o‘lcham berish imkonini beradi |
| grayscale() | Rasmni kulrang tuslarga (grayscale) aylantiradi |
| hsl() / hsla() | Rangni Hue-Saturation-Lightness (ton-to‘yinganlik-yorqinlik) modeli (HSL) yordamida belgilaydi; ixtiyoriy alfa komponenti bilan |
| hue-rotate() | Elementga rang aylantirishni (hue rotation) qo‘llaydi |
| hwb() | Rangni Hue-Whiteness-Blackness (ton-oqlik-qoralik) modeli (HWB) yordamida belgilaydi; ixtiyoriy alfa komponenti bilan |
| hypot() | Parametrlari kvadratlari yig‘indisining kvadrat ildizini qaytaradi |
| inset() | Tayanch qutining har bir tomonidan ko‘rsatilgan ichki masofalarda joylashgan to‘rtburchakni belgilaydi |
| invert() | Rasm rangini invertlaydi (teskari rangga aylantiradi) |
| lab() | Rangni CIE L*a*b rang fazosida belgilaydi |
| lch() | Rangni LCH (Lightness-Chroma-Hue) rang fazosida belgilaydi |
| light-dark() | Ikki rang qiymatini sozlash imkonini beradi: foydalanuvchi och rangli mavzuni tanlagan bo‘lsa, birinchi qiymatni, to‘q rangli mavzuni tanlagan bo‘lsa, ikkinchi qiymatni qaytaradi |
| linear-gradient() | Chiziqli gradient yaratadi |
| log() | Ko‘rsatilgan sonning natural logarifmini (E asosli) yoki sonning ko‘rsatilgan asosdagi logarifmini qaytaradi |
| matrix() | Olti qiymatli matritsa yordamida 2D transformatsiyani belgilaydi |
| matrix3d() | 16 ta qiymatdan iborat 4x4 matritsa yordamida 3D transformatsiyani belgilaydi |
| max() | Vergul bilan ajratilgan qiymatlar ro‘yxatidagi eng katta qiymatni xususiyat qiymati sifatida ishlatadi |
| min() | Vergul bilan ajratilgan qiymatlar ro‘yxatidagi eng kichik qiymatni xususiyat qiymati sifatida ishlatadi |
| minmax() | min qiymatidan katta yoki teng va max qiymatidan kichik yoki teng o‘lcham oralig‘ini belgilaydi (CSS gridlari bilan ishlatiladi) |
| mod() | Sonni boshqa songa bo‘lganda qolgan qoldiqni qaytaradi |
| oklab() | Rangni OKLAB rang fazosida belgilaydi |
| oklch() | Rangni OKLCH rang fazosida belgilaydi |
| opacity() | Elementga shaffoflik (opacity) effektini qo‘llaydi |
| perspective() | 3D transformatsiya qilingan element uchun perspektiv ko‘rinishni belgilaydi |
| polygon() | Ko‘pburchakni belgilaydi |
| pow() | Sonning (x) boshqa son (y) darajasidagi qiymatini qaytaradi |
| radial-gradient() | Radial gradient yaratadi |
| ray() | Animatsiyalangan element ergashishi kerak bo‘lgan offset-path chiziq kesmasini belgilaydi |
| rem() | Sonni boshqa songa bo‘lganda qolgan qoldiqni qaytaradi |
| repeat() | Griddagi ustunlar yoki qatorlar to‘plamini takrorlaydi |
| repeating-conic-gradient() | Konik gradientni takrorlaydi |
| repeating-linear-gradient() | Chiziqli gradientni takrorlaydi |
| repeating-radial-gradient() | Radial gradientni takrorlaydi |
| rgb() / rgba() | Ranglarni Red-Green-Blue (qizil-yashil-ko‘k) modeli (RGB) yordamida belgilaydi; ixtiyoriy alfa komponenti bilan |
| rotate() | Elementning 2D aylanishini belgilaydi |
| rotate3d() | Elementning x, y va z o‘qlari atrofida 3D aylanishini belgilaydi |
| rotateX() | Elementning x o‘qi (gorizontal) atrofida 3D aylanishini belgilaydi |
| rotateY() | Elementning y o‘qi (vertikal) atrofida 3D aylanishini belgilaydi |
| rotateZ() | Elementning z o‘qi atrofida 3D aylanishini belgilaydi |
| round() | Sonni ko‘rsatilgan yaxlitlash strategiyasiga ko‘ra yaxlitlaydi |
| saturate() | Elementning to‘yinganligini (rang intensivligini) sozlaydi |
| scale() | Elementning 2D masshtablanishini belgilaydi |
| scale3d() | Elementning 3D masshtablanishini belgilaydi |
| scaleX() | Elementni gorizontal bo‘yicha (kengligini) masshtablaydi |
| scaleY() | Elementni vertikal bo‘yicha (balandligini) masshtablaydi |
| sepia() | Rasmni sepiya tusiga aylantiradi |
| sin() | Sonning (burchakning) sinusini qaytaradi |
| skew() | Elementni x va y o‘qlari bo‘ylab qiyshaytiradi |
| skewX() | Elementni x o‘qi bo‘ylab qiyshaytiradi |
| skewY() | Elementni y o‘qi bo‘ylab qiyshaytiradi |
| sqrt() | Sonning kvadrat ildizini qaytaradi |
| steps() | Animatsiyalar uchun bosqichli vaqt funksiyasini (timing function) yaratadi |
| tan() | Sonning tangensini qaytaradi |
| translate() | Elementni x va y o‘qlari bo‘ylab qayta joylashtirish imkonini beradi |
| translateX() | Elementni x o‘qi bo‘ylab qayta joylashtirish imkonini beradi |
| translateY() | Elementni y o‘qi bo‘ylab qayta joylashtirish imkonini beradi |
| translateZ() | Elementni 3D fazoda z o‘qi bo‘ylab qayta joylashtirish imkonini beradi |
| url() | Uslublar jadvaliga faylni ulash imkonini beradi |
| var() | Maxsus xususiyat (custom property) qiymatini qo‘yadi |
| xywh() | O‘z ichiga olgan blokning x va y koordinatalaridan boshlanadigan, ko‘rsatilgan kenglik va balandlikka ega to‘rtburchak yaratadi |
W3Schools Pathfinder
Yutuqlaringizni kuzating – bu bepul!