تیشرت Laravel
خرید
اطلاعات بیشتر

ایجاد کدهای CSS با شبیه ساز Photoshop

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

اسم این وب سایت  LayerStyles است که همان کادر ویرایش خصوصیات لایه ها در Photoshop را شبیه سازی کرده است و شما با کشیدن و رها کردن در هر بخش می توانید کدهای CSS مربوط به اون بخش رو تولید کنید.

اگر به صفحه builder آن مراجعه کنید می توانید سریع و راحت با نحوه کار آن آشنا شوید.این پنجره شامل ۵ بخش مختلف است که دقیقا سعی شده مثل فتوشاپ باشند و با همان کارکرد.هر تغییری که روی این بخش ها انجام دهید روی کادر موجود در صفحه اعمال می شود و می توانید به زنده نتیجه کار را ببینید و در صورت رسیدن به نتیجه دلخواه تان کدها را کپی و استفاده کنید.

بعد از پایان کار کافیست روی دکمه سیاه رنگ پایین صفحه “CSS Code” کلیک و کدها را کپی کنید.

این پروژه اپن سورس بوده و به صورت کامل در Github در دسترس است و می توانید کدهای اصلی آن را ببینید دانلود کنید و حتی به صورت لوکال روی کامپیوترتان استفاده کنید.

در همین رابطه :   اعمال CSS های جداگانه به هر یک از مرورگر های Opera,Firefox,Chrome,Safari و IE
دسته بندی : CSS

پاسخ دهید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

More in عكاسی
۳۲ عکس پرتره بسیار زیبا (سری سوم)

استقبال گرم شما دوستان از موضوع عکس های پرتره  باعث شد این بار نیز با گلچینی از زیباترین عکس های پرتره...

Close