صفحه اصلی / ▼آموزشLearning / –3 آموزش سی اس اس Learning CSS3

–3 آموزش سی اس اس Learning CSS3

خاصیت HTML5 و CSS3 جدول واکنش گرا

یک خاصیت از HTML5 و CSS3 باعث میشه بدون استفاده از JavaScript جداول شما در صفحه های کوچک هم قابل خواندن بشه.   نحوه استفاده : با استفاده از خاصیت data-label برای مشخص کردن عناصر هر فیلد جدول. <table> <caption> Pure HTML5 / CSS3 Responsive Table Demo </caption> <thead> <tr> <th scope="col">Account</th> …

ادامه مطلب »

فونت آیکون Font Awesome

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

ادامه مطلب »

۱٠ ترفند CSS که احتمالا نمی دانستید!

١ – دستور کوتاه شده‌ی تنظیم فونت‌ها برای تنظیم فونت ها در CSS احتمالا تا کنون به طریق زیر عمل می کردید: font-weight: bold; font-style: italic; font-variant: small-caps; font-size: 1em; line-height: 1.5em; font-family: verdana,sans-serif; اما نیازی به استفاده از کد طولانی فوق نیست، زیرا به سادگی می توانید از کد …

ادامه مطلب »

٢۵ترفند CSS بسیار مفید که باید بدانید

٢۵ترفند CSS بسیار مفید که باید بدانید

در این مقاله، ٢۵ ترفند CSS بسیار مفید مطرح شده است که به شما کمک می کند صفحات وب بسیار عالی طراحی کنید. ممکن است شما برخی یا همه ی این ترفند ها را از قبل بلد باشید، با این حال، این می توانید یک مرجع دم دستی برای ترفند …

ادامه مطلب »

اضافه کردن متن به CSS با خاصیت Content

اگر برای شما هم سوال پیش آمده که چطوری با css متنی را اضافه کنیم با این آموزش همراه باشید. قبل از این آموزش باید با سلکتورafter و before آشنا بشید و بدونید که این خاصیت فقط در IE8 به بعد به درستی نمایش داده میشه و باید از <!DOCTYPE …

ادامه مطلب »

آشنایی با دو عنصر rgb و rgba در CSS

آشنایی با دو عنصر rgb و rgba در CSS

rgb و rgba در اصل یکی هستند . و rgba نسخه جدیدتری نسبت به rgb هست که در بین کد های CSS3 عرضه گشته در زیر این مطلب یک تصویر میبینید که دارای دو قسمت هست که قسمت اول با rgb ایجاد گردیده و فسمت دوم تصویر با rgba ایجاد …

ادامه مطلب »

تمام صفحه کردن عکس پشت زمینه با CSS

اگر عکسی را برای پشت زمینه انتخاب کنید میبینید که تمام صفحه توسط عکس پر نمیشه و گوشه های صفحه خالی میمونه. با استفاده از خاصیت زیر عکس تمام پیکسل های صفحه را پوشش میدهد. کد HTML : <html> <head> <title></title> <link href="style.css" type="text/css" rel="stylesheet"></link> </head> <body> <img alt="full screen …

ادامه مطلب »