السلام علیک یا اباعبداللّه الحسین

سبد خرید (0)

مقدمه آموزش CSS3

CSS3

آموزش CSS3 (سی اس اس 3) - معرفی CSS3 (سی اس اس 3)

Wiki

CSS3 (سی اس اس 3) جدیدترین استاندارد برای CSS است.

CSS3 (سی اس اس 3) با نسخه های قبلی، کاملاً سازگار است.

در این آموزش، با ویژگی های جدید CSS3 (سی اس اس 3) آشنا خواهید شد.


CSS3 (سی اس اس 3) Transforms


آموزش Moduleها در CSS3 (سی اس اس 3)

Wiki

CSS3 (سی اس اس 3) به بخش هایی بنام Module تقسیم می شود. در CSS3 (سی اس اس 3) نسبت به نگارش قبلی برخی از خواص به بخش های کوچکتری تقسیم شده اند و برخی خواص جدید نیز اضافه شده است.

بعضی از مهم ترین Moduleهای CSS3 (سی اس اس 3):

  • آموزش CSS3-لبه ها: گوشه ها را گرد کنید، سایه اضافه کنید و یا از تصاویر برای حاشیه ها استفاده نمایید.
  • آموزش CSS3-پس زمینه: اندازه تصویر پس زمینه را مشخص نمایید و یا از چند تصویر به عنوان پس زمینه استفاده کنید.
  • آموزش CSS3-شیب رنگ: یک انتقال آرام بین دو یا چند رنگ مختلف را نمایش دهید.
  • آموزش CSS3-افکت های متن: متن را سایه دار کنید و نوشته های بلند را بشکنید.
  • آموزش CSS3-فونت: هر فونتی را که می خواهید استفاده نمایید. حتی اگر روی کامپیوتر کاربر نصب نباشد.
  • آموزش CSS3-تبدیل دو بعدی: با تبدیل دو بعدی، عناصر را حرکت دهید، بچرخانید، خم کنید، تغییر اندازه دهید و یا بکشید.
  • آموزش CSS3-تبدیل سه بعدی: تبدیل سه بعدی به عناصر جلوه سه بعدی اضافه می کند.
  • آموزش CSS3-انتقال یا Transision: در صورت تغییر ویژگی های یک عنصر، می توانیم این تغییر را بصورت تدریجی مشاهده نماییم.
  • آموزش CSS3-متحرک سازی: عناصر را متحرک نمایید.
  • آموزش CSS3-متن های چند ستونه: مانند روزنامه ها که چند ستونه هستند، متن را در صفحه به صورت چند ستونه نمایش دهید.
  • آموزش CSS3-رابط کاربری: تغییر اندازه عناصر توسط کاربر، تنظیم دقیق اندازه عنصر و کشیدن حاشیه با فاصله از لبه اصلی.

توصیه CSS3 (سی اس اس 3)

Wiki

خصوصیات CSS3 (سی اس اس 3) همچنان توسط W3C تحت توسعه است.

با این حال، بسیاری از قابلیت ها و ویژگی های CSS3 (سی اس اس 3) داخل مرورگر های مدرن اجرا شده است.


فیلم آموزش CSS3

در صورتی که فرصت مطالعه مطالب ارائه شده در سایت بیاموز را ندارید و می خواهید در کمترین زمان ممکن CSS پیشرفته را فرابگیرید، پیشنهاد ما، تهیه "فیلم آموزش CSS3" است.

در فیلم آموزشی زیر می توانید، جلسه اول آموزش css3 را مشاهده نمایید:

لطفا برای تهیه آموزش بالا، روی لینک روبرو کلیک فرمایید: فیلم آموزش CSS3

دیدگاه‌ها  

+4 # Guest 1395-05-04 11:17
با سلام
با تشکر از سایت خوب و عالیتون .یه سوال خارج از این مبحث داشتم .می خواستم بدونم برای یادگیری طراح UX , UI چه چیزهایی لازمه یاد بگیرم؟ممنون میشم از راهنماییتون
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+4 # مهرداد صلاحی 1395-05-07 21:11
با سلام.
UI یعنی رابط کاربری و بیشتر با ظاهر بصری سایت سر و کار داره، ولی UX مربوط به تجربه‌ی کاربری که میشه که کمی‌ فراتر از UI هست و فقط جنبه‌ی ظاهری رو شامل نمیشه.
مثلا برای خرید از یه فروشگاه، باید بررسی بشه که کاربر چه مراحلی رو دوست داره که اتفاق بیفته تا یه خرید راحت انجام بده...

برای اولی باید بیشتر روی دیزاین و گرافیک تمرکز کنید، ولی برای UX نیاز به کسب تجربه و بررسی نمونه‌ سایت‌های مختلف دارید.
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+4 # Farzane Nikbakht 1395-03-09 13:16
سلام فیلم آموزش css3 رو ميخواستم...فقط فایل pdf موجوده؟
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+4 # امیر پهلوان صادق 1395-03-10 13:48
سلام، فیلم آموزش CSS3 در حال آماده سازی است و بمحض اینکه آماده شد ان شا الله اطلاع رسانی خواهد شد.
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+5 # farshid 1394-09-06 22:19
جالب و کاربردی...مثله همیشه....ممنون
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+5 # #ali 1394-05-05 17:31
با سلام و تشکر از سایت عالی تون
واقعا کار تیم شما در زمینه ترجمه سازی و تدوین مطالب سایت فوق العاده عالی بوده است، امیدواریم بازهم از این کارها بکنید.
خداقوت
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+10 # farnaz 1393-09-14 09:01
با سلام و تشکر از سایت عالیتون
می خواستم خواهش کنم نحوه چیدمان صفحه رو آموزش بدین من چیزایی که یادگرفتم نمی تونم کنار هم بزارم و یه صفحه کامل طراحی کنم
ممنون
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+20 # امیر پهلوان صادق 1393-09-14 16:24
سلام، همان طور که می دانید، دو روش برای صفحه بندی وجود دارد:
1- با استفاده از عنصر div
2- با استفاده از عنصر table
در اینجا قصد دارم طراحی یک صفحه 2 ستونه را با استفاده از عنصر div خدمت شما آموزش دهم، اما قبل از شروع، باید مفهوم عناصر block و inline را کاملاً درک کرده باشید. همان طور که می دانید عنصر div یک عنصر block است، یعنی تمام طول یک سطر را به خود اختصاص می دهد، بنابراین زمانی که قصد طراحی یک صفحه دو ستونه را داریم به مشکل بر خواهیم خورد. اما راه حل این مشکل در خصوصیت float نهفته است، این خصوصیت علاوه بر اینکه عنصر را به سمت راست یا چپ شناور می کند، اگر عنصر float شده از نوع block باشد، آنرا به نوع inline نیز تبدیل خواهد کرد.
حالا با این مقدمه، بهتر می توانیم آموزش طراحی صفحه دو ستونه را آموزش بدیم. اما صفحه ی ما به یک header و یک footer نیز نیز دارد، بنابراین ابتدا یک div برای header و سپس در زیر آن دو تا div که کنار هم قرار می گیرند و دو ستون صفحه را تشکیل می دهند و نهایتاً یک div دیگر که در زیر دو ستون قرار می گیرد.
اما بنظرتون بهتر نیست که این مجموعه را داخل یک ظرف قرار بدیم، تا اگر زمانی خواستیم تغییری روی کل مجموعه بدهیم، بسادگی امکان پذیر باشد.
لطفاً با کلیک روی لینک زیر، مثال "خودتان امتحان کنید" مربوطه به توضیحات بالا را مشاهده نمایید:

http://www.beyamooz.com/try_it_yourself/tryit.php?filename=tryhtml_layout_divs
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+22 # محسن 1392-11-11 14:22
یا سلام ، ضمن خسته نباشد و خداقوت خدمت شما زحمت کشان ، خواهشمند است در صورت امکان نسخه PDF آموزش ها رو داخل سایت قرار دهید .مثلا آموزش PHP
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+3 # حمید مرادپور 1394-02-13 21:57
با سلام . خسته نباشید خدمت اساتید گرامی .

با ایجاد این سایت به معنای واقعی " برنامه نویسی را معنایی دیگر ببخشیم "را پیاده کردین .

واقعا با این سایت و این نحوه آموزش و پاسخگویی سریع به سوالات منت بزرگی را به گردن ما گذاشتین

من سایتهای زیادی رو امتحان کردم اکثر اونها نیمه راه آموزش رو ول کردن ولی شما این کار رو به پایان رساندین

امیدوارم در آینده نزدیک بتونیم با هم همکاری کنیم .
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+7 # امیر پهلوان صادق 1394-02-14 00:11
سلام، نظر شما باعث دلگرمی تیم ما خواهد شد و ان شا الله با قدرت بیشتر ادامه خواهیم داد.
منتظر تماس شما برای همکاری هستم.
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن

آموزش صوتی CSS3

بستن
انتخاب مدرس:

ابزاری که در پیش روی دارید یکی از ابزارهای بسیار کاربردی سایت بیاموز در زمینه آموزش است، این ابزار برای سهولت یادگیری شما کاربران محترم طراحی شده است.

فقط کافی است روی عنوان پاراگراف مورد نظرتان کلیک کنید تا پخش صدا آغاز شود ...!