Html and Css & Jsآموزش
ادمین : @Maryam3771 تعرفه تبلیغات: https://t.me/alloadv/822
Ko'proq ko'rsatish📈 Telegram kanali Html and Css & Jsآموزش analitikasi
Html and Css & Jsآموزش (@htmlcss_channels) Forsiy til segmentidagi kanali faol ishtirokchi. Hozirda hamjamiyat 22 721 obunachidan iborat bo'lib, Taʼlim toifasida 8 792-o'rinni va Eron mintaqasida 14 823-o'rinni egallagan.
📊 Auditoriya ko‘rsatkichlari va dinamika
невідомо sanasidan buyon loyiha tez o‘sib, 22 721 obunachiga ega bo‘ldi.
16 Iyun, 2026 dagi oxirgi ma’lumotlarga ko‘ra kanal barqaror faollikka ega. Oxirgi 30 kunda obunachilar soni 1 451 ga, so‘nggi 24 soatda esa -2 ga o‘zgardi va umumiy qamrov yuqori darajada qolmoqda.
- Tasdiqlash holati: Tasdiqlanmagan
- Jalb etish (ER): Auditoriya o‘rtacha 2.95% darajada jalb etiladi. Nashrdan keyingi dastlabki 24 soatda kontent odatda umumiy obunachilar sonining 1.49% ini tashkil etuvchi reaksiyalarni to‘playdi.
- Post qamrovi: Har bir post o‘rtacha 670 marta ko‘riladi; birinchi sutkada odatda 338 ta ko‘rish yig‘iladi.
- Reaksiyalar va o‘zaro ta’sir: Auditoriya faol: har bir postga o‘rtacha 3 ta reaksiya keladi.
- Tematik yo‘nalishlar: Kontent css, #javascript, دنیا, وبینار, شغل kabi asosiy mavzularga jamlangan.
📝 Tavsif va kontent siyosati
Muallif resursni shaxsiy fikrni ifoda etish maydoni sifatida ta’riflaydi:
“ادمین :
@Maryam3771
تعرفه تبلیغات:
https://t.me/alloadv/822”
Yuqori yangilanish chastotasi (oxirgi ma’lumot 17 Iyun, 2026 da olingan) sababli kanal doimo dolzarb va katta qamrovli bo‘lib qoladi. Analitika auditoriya kontent bilan faol hamkorlik qilishini, uni Taʼlim toifasidagi muhim ta’sir nuqtasiga aylantirishini ko‘rsatadi.
class DotsPainter {
paint(ctx, geom, props) {
ctx.fillStyle = 'pink';
for (let y = 0; y < geom.height; y += 20) {
for (let x = 0; x < geom.width; x += 20) {
ctx.beginPath();
ctx.arc(x, y, 5, 0, 2 * Math.PI);
ctx.fill();
}
}
}
}
registerPaint('dots', DotsPainter)
یه کلاس جاوااسکریپت مینویسی که روی canvas رسم میکنه.
۲️⃣ ثبت Worklet
CSS.paintWorklet.addModule('paint.js');
فایل جاوااسکریپت رو به مرورگر معرفی میکنی.
۳️⃣ استفاده در CSS
.box {
background: paint(dots);
}
حالا میتونی مثل background معمولی استفاده کنی!
۴️⃣ شخصیسازی با متغیرها
ctx.fillStyle = props.get('--dot-color') || 'pink';
```css
.box {
background: paint(dots);
--dot-color: blue;
}
رنگ رو از CSS تغییر بده! ۵️⃣ نتیجه • ✅ بدون عکس • ✅ بدون پلاگین • ✅ فقط CSS خالص • ✅ روی compositor thread اجرا میشه (سریع) چرا CSS Houdini مهمه؟روش قدیمی | با Houdini ------------+----------------
عکس یا SVG | کد جاوااسکریپت
استایل ثابت | پارامترهای پویا
حجم بالا | سبک و سریع
💎 @Htmlcss_channels | #HTML #css #JavaScript⏰ 170 ساعت | آموزش آنلاین و آفلاین ✅ امکان کارآموزی در گروه همراه اول ✅ امکان ثبتنام به صورت اقساطی🌐 لینک پیشثبتنام #رایگان: 🔗 https://l.hamrah.academy/wbv ⭐️ @Hamrah_Academy | آکادمی همراه اول
.container {
display: grid;
place-items: center;
}
یه خط ساده که همه چیز رو وسط میاره! هم عمودی، هم افقی.
۲️⃣ پدینگ چپ و راست (با logical properties)
.button {
padding-inline: 1rem;
}
به جای padding-left و padding-right — یه دونه بنویس!
نکته: همین ترفند رو میتونی برای margin و border هم استفاده کنی:
• margin-inline / border-inline → چپ و راست
• padding-block / margin-block → بالا و پایین
۳️⃣ ستونهای همعرض در گرید
.container {
display: grid;
grid-auto-flow: column;
grid-auto-columns: 1fr;
}
هر تعداد ستون که داشته باشی، همه همعرض میشن! عالی برای layoutهای داینامیک.
۴️⃣ استایل همزمان hover و focus
button:is(:hover, :focus) {
/* استایل خودت رو اینجا بنویس */
}
یه بار بنویس، برای هر دو حالت کار کنه! هم برای موس، هم برای کیبورد (accessibility).
۵️⃣ دایره کامل
.circle {
width: 2rem;
aspect-ratio: 1 / 1;
border-radius: 50%;
}
هرچیزی رو تبدیل به دایره میکنه! با aspect-ratio مطمئن میشی که همیشه square بمونه.
۶️⃣ حذف فاصله اضافی بین آیتمهای گرید
.container {
gap: 0;
}
یا برای فاصله دلخواه:
.container {
gap: 1rem;
}
💡 چرا اینا کاربردی ان؟
• کوتاه و مینیمال — هر کدوم یه خطه
• مدرن — از قابلیتهای جدید CSS استفاده میکنن
• کاربرد روزمره — توی هر پروژهای بهشون نیاز داری
#CSS #WebDevelopment #Frontend #برنامه_نویسی
Endi mavjud! Telegram Tadqiqoti 2025 — yilning asosiy insaytlari 
