توسط قابلیت Grid می توانیم بخش بندی و گرید بندی صفحات html رو انجام بدیم، ما در این مقاله به مطالب مهم این حوزه اشاره کرده ایم. Grid برای استفاده از گرید بندی باید حالت نمایشی المان پدر رو روی حالت grid قرار دهیم. .container { display: grid; } Grid-template-columns توسط این پراپرتی می توانیم … ادامه
فلکس باکس (FlexBox) چیست و چه کاربردی دارد؟ Flexible Box Layout قابلیت جدید CSS است که برای مرتب کردن و طرح بندی عناصر داخلی یک کانتینر کاربرد دارد، با استفاده از فلکس باکس می می توانیم مدیریت بهتری بر روی عناصر داخلی یک بخش داشته باشیم. در ادامه با جزئیات و سایر پراپرتی های فلکس … ادامه
در CSS قالب های خوبی برای خلق انیمیشن های جذاب در صفحات وب وجود دارد. توسط این پراپرتی و توسط رول keyframe می توانیم انیمیشن های جذابی برای صفحات وب ایجاد کنیم. ما محدود و عامیانه توضیح دادیم، خواستی بیشتر بدونی این لینک رو ببین. /* پراپرتی مخصوص نوشتن دستورات انیمیشن در واقع داخل این … ادامه
توسط مدیا کوئری ها در css می توانیم المان های خودمان را نسبت به عرض صفحه نمایشگر کاربر چیدمان کنیم و استایل های مختلفی برای سایز های متفاوت نمایشگر داشته باشیم. در این لینک و این لینک بصورت کامل توضیح داده شده است، ما نیز یکسری توضیحات عامیانه ای را در مقاله مطرح می کنیم. … ادامه
متغییر ها در CSS مثل یک ظرف هستند که داده ای رو در خود نگهداری می کنند و ما می توانیم از طریق نام متغییر می توانیم به داده هاش دسترسی داشته باشیم. فرض کنیم یک کد رنگی رو به عنوان متغییر تعریف کردیم و همه جا میتونیم بهش دسترسی داشته باشیم و دیگه نیاز … ادامه
از ترانس فرم برای چرخش المان ها، بزرگ و کوچک کردن و… استفاده میشود که مقادیر زیادی را می پذیرید. ما یکسری از مقادیر مهمش رو در ادامه بررسی میکنم ولی اگر نیاز به اطلاعات بیشتری داشتید میتونید از این لینک مطالعه کنید. rotate چرخش المان، توسط rotate اتفاق می افته، که بصورت transfotm: rotate(20deg) … ادامه
از پراپرتی transition برای تاخیر در تغییر وضعیت یک المانی استفاده میشه، فرض کنیم یک دکمه داریم که رنگش سبزه، و در حالت hover آن گفتیم وقتی ماوس میره روش رنگش سبز کم رنگ بشه، وقتی ماوس روش میره این تغییر رنگ با سرعت زیاد انجام میشه و یه حالت بدی رو ایجاد میکنه، ما … ادامه
در سی اس اس هم می توان یکسری عملیات ریاضی را در کدهای css انجام داد که ما به یکسری از آنها اشاره می کنیم: Calc (1000px + 280px) با استفاده از این دستور می توان عملیات ریاضی را در دادن اعداد به پراپرتی ها استفاده کرد. به مثال زیر توجه کنید: .box { width: … ادامه
در css این امکان وجود داره که ما از طریق پراپرتی خاصی، بتوانیم attribute های فایل html رو انتخاب کرده و بهشون استایل بدیم. که در ادامه توضیحاتی ارائه شده است. [attribute] توی این پراپرتی می توانیم المان هایی را در html انتخاب کنیم که این اتری بیوت رو دارند، برای مثال کد زیر رو … ادامه
سودو کلاس ها، در واقع کلاس هایی هستند که با : در کد سی اس اس قابل استفاده است. در ادامه برخی از Pseudo-classes توضیح داده شده است، برای کسب اطلاعات بیشتر می توانید این لینک را مشاهده کنید. root: این کلاس در واقع شبیه به html است و کدهای اعمالی به آن به تگ … ادامه