Instagram
اخبار سایت :
  • هیچی فقط همیشه سالم و سلامت باشین :دی

کد های زیبای CSS

کد بازتاب متن با استفاده از CSS

تو اونجا جاوا اسکریپت بود تو اینجا سی اس اس هست. هر کدومش هم یه طوری کرم میریزه. مثلا من می تونستم توی این یکی خاصیت اون تار شدنش رو هم اضافه کنم (با پس زمینه ها و ...) ولی اون وقت باید متنی که توی اون می نویسین رو دو بار می نوشتین.

در کل اینم از این دیگه خودتون برین دست تو پر و پاچش کنین یه چیزی بشه تهش :دی

با تشکر

ادامه مطلب
سلام.
احتمالا تابحال با فریمورک هایی کار کردین که شکل چک باکس ها، رادیوها و یا چیزایی که به طور معمول شکلشون عوض نمیشه (مثلا انتخاب فایل ها) رو عوض میکنن. نمونه ش همین Bootstrap یا هر چیز دیگه ای...
"اصول کار این فریمورک های خصوصیت for یه تگ label هستش که برابر با id اون input باشه"
بعد ما هر استایلی رو که به اون label بدیم؛ انگار اون استایل رو به اون input دادیم.
توجه!
هر استایل یا کد حاوااسکریپتی که اینجا میبینید فقط برای استایل دادن به label هستن و کار اصلی رو همون خصوصیت for تگ label مون میکنه.

اما حالا بگیم که اینجا چه اتفاقی افتاده:
input ~ label[for]
این سلکتور label هایی رو انتخاب میکنه که خاصیت for داشته باشن و قبلشون هم یه input وجود داشته باشه.

input:checked:not([type="file"]) + label[for]
این سلکتور هم label ـی رو انتخاب میکنه که خاصیت for داشته باشه و قبلش یه input باشه با این شرایط:
1- تیک خورده باشه.
2- از نوع ورودی فایل نباشه.
توجه کنین که + برای اینه که فقط یکی انتخاب بشه اما ~ هر چند تا باشه رو انتخاب میکنه...
(فهم تفاوت این سلکتورها جز با تمرین بدست نمیاد؛ حالا من خودمو جر بدم... :دی )

input[type="file"]:valid + label[for]
این سلکتور label هایی رو انتخاب میکنه که قبلشون یه input هز نوع فایل وجود داشته باشه و "مقدار مناسب" داشته باشه.
کارکرد این سلکتور فقط در صورتی مشخص میشه که ما به input مون خصوصیت required داشته باشیم؛ و این یعنی نیاز به ساپورت html5...

توی کدهای کامنت شده هم میبینین که من برای input های خاص؛ رنگ دلخواهم رو انتخاب کردم.

اما کلا این استایل های ما قراره چه نتیجه ای داشته باشن؟؟
در حالت عادی من یه استایلی بهش دادم.
بعد گفتم هر وقت که المنت مون انتخاب شد رنگش عوض بشه(#eee)

در مورد اون فایل هم هروقت فایلی انتخاب شد رنگش تغییر کنه(بشه #eee)

کدهای جاوااسرکیپت رو هم واقعا ساده نوشتم و فکر نمیکنم احتیاج به توضیحی داشته باشن؛ با این حال هم در کامنتا و هم در انجمن؛ جواب میدم...

با تشکر... :P
پ.ن.:
مویزرکس اگه عنوان جالبتری سراغ داشتی همون رو بزار؛ به نظرم این زیاد خوب نشد. ادامه مطلب

امروزه با آمدن ورژن 3 از زبان متفاوت css باعث شده است که کدنویس ها به جای استفاده از گرافیک و حجم بالای تصاویر در صفحه از کدها استفاده کنند. از این رو استفاده از لودینگ های سی اس اس نیز در چنین شرایطی علاوه بر سرعت لود بالاتر نسبت به عکس زیبایی و قابلیت انعطاف بسیار زیادی را دارد.

در این مطلب قصد داریم تا دو نمونه از لودینک هایی که با استفاده از کدهای سی اس اس و انیمیشن در سی اس اس ساخته شده اند را برای شما به اشتراک بگذاریم. این دو شبیه به هم بوده و فقط در دو خاصیت با هم تفاوت دارند.

ادامه مطلب

این جعبه دانلود توسط mohamad_77 طراحی و برای ما ارسال شده است. این جعبه با استفاده از CSS شده و در آن از CSS3 هم استفاده شده است که به همین دلیل در مرورگر های قدیمی عملکرد مناسبی نخواهد داشت.

«قسمت دانلود»

 

ادامه مطلب
ابزار ساخت قالب برای صفحات جداگانه

شما با استفاده از این ابزار می توانید قالب ساده ولی زیبایی مانند تصویر دمو ایجاد کنید. زیبا سازی این قالب کاملا با استفاده از CSS ساخته شده است و در آن از هیچ گونه کدحاوا اسکریپتی استفاده نشده است.

این قالب برای صفحات جداگانه و یا حتی قالب صفحه اصلی و ... طراحی شده است و یک قالب برای سیستم های وب دهی و ... نیست و در اصل یک قالب HTML می باشد.

برای دیدن دمو اینجا کلیک کنید.

ادامه مطلب
    کلاس های آنلاین فعال

    برای افزایش دانش عمومی کاربران سعی بر این داریم که کلاس های آنلاینی برگزار کنیم. لیست این کلاس (ها) را می توانید در زیر ببینید. این قسمت را هر روز چک کنید تا از کلاس ها و اخبار جدید با خبر شوید. کلاس ها توسط همین کاربران و دوستان شما برگزار میشود. اگر مایل به برپایی کلاس آموزشی ای در هر زمینه ای هستید با مدیر تماس بگیرید.

    مدرس: محمد و اقبال
    آموزش PHP - جلسه اول
    پنجشنبه 04 تیر 1394 - 17:00
    هیچ کلاس فعالی موجود نیست.
    کاربران آنلاین
    آمار
    مطالب : 792
    نظرات : 4371
    تعداد اعضا : 36598
    افراد آنلاین : 2
    بازدید امروز : 918
    بازدید دیروز : 824
    گوگل امروز : 111
    گوگل دیروز : 110
    بازدید هفته : 918
    بازدید ماه : 27,976
    بازدید سال : 340,360
    بازدید کلی : 10,734,836