css
- همه دسته ها
-
- قالب html
- طرح لایه باز
- قالب وردپرس
- پلاگین وردپرس
- قالب و افزونه
- سیستم مدیریت محتوا
- سئو و بهینه سازی
- گرافیک
- آموزش طراحی سایت
فروشی و حرفه ای
رایگان
چطوری میتونم یک وب سایت فروشگاهی بسازم با html,css,js ؟ آموزش تصویری رایگان + متنی رایگان
چطوری میتونید وب سایت فروشگاهی بسازید ؟ من قول میدم بهتون این کارو براتون خیلی راحت آموزش بدم اگه باور ندارد چند دقیقه وقتتو بذارید ببینید چه راز هایی بهتون خواهم گفت ؟
این آموزش یک آموزش فول استک و کامل برای ساخت یک وب سایت با html می باشد که مشکل بسیار از برنامه نویسان می باشد چرا که یک برنامه نویس باید ساختار وب سایت را درک کند و بتواند در زمان مناسب ریکشن نشان دهد موافقین ؟ اگه...
رایگان
آموزش حذف css های استفاده نشده در وردپرس
آموزش wordpressآیا می خواهید CSS استفاده نشده را در وردپرس حذف کنید تا سایت شما سریعتر بارگیری شود؟
CSS استفاده نشده هر کد CSS است که توسط قالب یا افزونه های وردپرس شما اضافه شده است که واقعاً نیازی به آن ندارید. حذف این کد CSS عملکرد وردپرس و تجربه کاربری را بهبود می بخشد .
در این مقاله ، ما به شما نشان خواهیم داد که چگونه CSS بدون استفاده را در وردپرس بدون ایجاد مشکل در وب سایت خود به راحتی حذف...
رایگان
مجموعه 30 انیمیشن css و svg کاربردی و جذاب
آموزش cssتمامی انیمیشن های معرفی شده با css و svg و در برخی موارد همراه javascript نیز معرفی شده اند انیمیشن ها قابل دانلود هستند برای دانلود میتوانید از روی کد های آنلاین codepen دانلود را انجام بدید
Border توسط شان مک کافری
هنگامی که روی دستورالعمل "HOVER" می روید ، فقط با CSS ساخته می شود و یک حاشیه به راحتی متن ایجاد می شود.
Elastic SVG Sidebar by Nikolay Talanov
نوار کناری وقتی می خواهید آن را از کنار خود...
رایگان
دانلود سورس js , css نمایش گالری تصاویر به صورت سه بعدی
آموزش cssایده این منبع این است: اگر من یک گالری محصولات داشته باشم، من بهترین تصویر را برای هر یک از آنها انتخاب می کنم. اما اگر یک تصویر کافی نیست چه؟ مشتری بر روی محصول کلیک می کند، او به صفحه محصول تکیه می کند، و در بیشتر موارد، یک نمایش اسلاید در آنجا پیدا می کند. با این حال، اگر آنها قبل از رفتن به صفحه محصول، تصاویر بیشتری از یک محصول مشابه را ببینند، احتمال بیشتری وجود دارد که آنها...
رایگان
دانلود پروژه css , java جهت نمایش نمونه کار ها با انیمیشن بسیار جذاب
آموزش cssما با ایده حرکت بلوک های محتوا به عنوان راهی برای انتقال از صفحه اصلی / گالری به صفحه پروژه، بازی کرده ایم. تمام پانل ها در امتداد محور Y حرکت می کنند (محور x در دستگاه های کوچکتر)، و حرکت به وسیله ی این که کاربر میخواهد بیشتر درباره یک پروژه یاد بگیرد یا میخواهد به ناوبری دسترسی پیدا کند، حرکت می کند.
تصاویر: unsplash.com
ایجاد ساختار
ساختار HTML از دو لیست های نامرتب تشکیل...
رایگان
دانلود سورس js , css جستجو پیشرفته با انیمیشن زیبا
آموزش cssبدست آوردن تجربه جستجو به راستی کار ساده ای نیست. نقطه شروع همیشه فرم جستجو است که در اکثر موارد تنها شامل یک فیلد ورودی و یک دکمه ارسال است. صفحه نتایج جستجو برای طراحی بسیار مشکل است، مخصوصا اگر شما دارای دسته های مختلف محتوا باشید.
برای وب سایت های بزرگ و فروشگاه های آنلاین، چه مهم است، اما سعی کنید پیش بینی حرکت کاربر. ما باید توجه داشته باشیم که اغلب کاربران ما در مورد کجا...
رایگان
دانلود سورس انیمیشن js , css جهت صفحه بندی خدمات شما بدون رفرش
آموزش cssما اخیرا با یک انیمیشن طراحی شده با CSS تجربه کردیم که جایگزین تازه کردن صفحه وب می شود در حالی که محتوای با استفاده از ajax به روز شده است. انفجار امروز بر اساس یک ایده است، اما با یک اجرای متفاوت: در این زمان یک اثر شناور ساده تبدیل به یک نوار بارگذاری، که در نهایت با محتوای جدید گسترش می یابد!
آیکون های کتابخانه هسته ای ما .
ایجاد ساختار
ساختار HTML از یک...
رایگان
باکس ثبت نام حرفه ای با انیمیشن زیبا css,jquery
آموزش cssدر بیشتر موارد، کاربران خود را به یک صفحه ثبت نام هدایت می کنید. با این حال، اگر فرآیند پرداخت شما کاملا ساده باشد، یک روش جایگزین برای جابجایی جدول قیمت گذاری است، و در همان صفحه، فرم پرداخت را نشان می دهد. این همان چیزی است که ما با قطعه امروز تلاش کردیم.
صحبت کردن به اندازه کافی، بیایید به کد بچرخانیم؛)
منابع:
Velocity.js توسط جولیان شاپیرو.
آیکون از Nucleo .
ایجاد...
رایگان
دانلود منو ساید بار زیبا با css , jquery همراه با دمو
آموزش cssنوشتن رسپانسیو منو برای سایت های مگا، کار ساده ای نیست. اگر شما در حال کار بر روی یک پنل مدیریت هستید، احتمالا شما باید یک منوی عمودی را طراحی و توسعه دهید، با مقدار زیادی زیر مجموعه ها. به همین دلیل تصمیم گرفتیم قطعه امروز را به اشتراک بگذاریم! ناوبری نوار ابزار ما می تواند زندگی شما را ساده تر با ارائه یک قالب شروع ساده برای پروژه بعدی خود؛)
آیکون: کتابخانه هسته...
رایگان
سورس کامل به همراه پیشنمایش تایم لاین jqruey , css
آموزش cssخط زمانی عمودی ما تا کنون یکی از محبوب ترین منابع در ملت وب است. بسیاری از شما از ما خواسته اید تا یک جدول زمانی افقی را نیز اضافه کنید. که تقدیم شما میگردد.
ساخت یک جدول زمانی افقی کمی دشوار بود، زیرا شما نمی توانید به عمودی (بصری) رفتار پیمایش تکیه کنید. ما تصمیم گرفتیم جداول زمانی و حوادث را جدا کنیم، اولین کسی که مانند یک نوار لغزنده کار می کند، در حالی که دومین اشغال...
رایگان
آموزش کامل و سورس سبد خرید css , jquery با پیشنمایش و دانلود
آموزش cssما در مورد فرآیند "اضافه به سبد خرید" به الگوهای مختلفی استفاده می کنیم. ایده اصلی این الگو، اطلاع دادن به کاربر است که یک مورد به سبد اضافه شده است و او را با یک پیوند برای ادامه به پرداخت، ارائه می دهد.
ما با این ایده مخفی کردن سبد خرید به طور پیش فرض آزمایش کرده ایم و آن را زمانی که کاربر بر روی دکمه «افزودن به سبد خرید» کلیک می کند نشان می دهد. به این ترتیب کاربر می...
رایگان
دانلود سورس استایل CSS برای منو کشویی با انیمیشن
آموزش cssساختار
از دو عنصر اصلی تشکیل شده است nav.main-navبرای موارد ناوبری بالا و div.morph-dropdown-wrapperبسته بندی عناصر کرکره.
برای هر آیتم لیست در nav.main-navعنصر، a li.dropdownدر داخل ایجاد می شود .morph-dropdown-wrapper.
Open Nav
About
Pricing
Contact
اضافی div.bg-layerدر داخل ساخته شده است div.morph-dropdown-wrapperو برای ایجاد پس زمینه morphing dropdown استفاده می شود.
افزودن سبک
در...
رایگان
دانلود منبع CSS نقشه سایت یا Breadcrumbs
آموزش css
ایجاد ساختار
ساختار HTML بسیار ساده است: یک لیست مرتب از اقلام، پیچیده را به یک <nav>عنصر.
<nav>
<ol class="cd-breadcrumb">
<li><a href="#0">Home</a></li>
<li><a href="#0">Gallery</a></li>
<li><a href="#0">Web</a></li>
<li class="current"><em>Project</em></li>
</ol>
</nav>
افزودن سبک و دستورالعمل
ما 2 کلاس اصلی...
رایگان
آموزش اضافه کردن css به وردپرس با افزونه و بدون افزونه
آموزش wordpressدر این آموزش، ما درباره CSS سفارشی وردپرس بحث خواهیم کرد. سه راه برای اضافه کردن CSS در وردپرس وجود دارد:
افزونه سفارشی وردپرس CSS؛
سفارشی سازی تم ساخته شده با استایل های خودشان
تم کودک وردپرس(child theme)
از طریق این آموزش، امیدواریم بتوانید نحوه ایجاد CSS خود را در WordPress پیدا کنید. بنابراین شما می توانید عناصر خاصی را مدیریت کنید و وب سایت خود را جذاب تر و کاربر پسند تر...
رایگان
دانلود رایگان کد گالری تصویر بسیار جذاب با html,jquery,css
آموزش cssایجاد ساختار
HTML در 2 اصلی ساختار <div> با کلاس ( .cd-slider-wrapperو .cd-item-info) - اولی مربوط به گالری عکس و دوم اطلاعات محصول (عنوان، دکمه عمل ..) - پیچیده در داخل یک section.cd-single-item. محتوای باقی مانده در یک .cd-contentبخش جداگانه وارد شده است .
<section class="cd-single-item">
<div class="cd-slider-wrapper">
<ul class="cd-slider">
<li class="selected"><img src="img/img-1.jpg"...
رایگان
50+ فرم ورود HTML5 و CSS3 رایگان
قالب سایتما معمولا از طریق یک فرایند ورود هر روز در زندگی دیجیتال ما رفتن بسیار. بسیاری از برنامه های کاربردی نیاز به ورود به منظور استفاده از خدمات خود را. برای چنین برنامه های کاربردی، فرم ورود اولین عنصر رابط کاربر یک کاربر ممکن است تجربه است. SO طراحی یک صفحه ورود به سیستم خوب است که باید برای چنین برنامه های کاربردی است. طراحی صفحه ورود به سیستم بخش روی حیله و تزویر برای طراحان UI...
رایگان
25+ کتابخانه انیمیشن CSS رایگان
آموزش cssامروز ما در حال رفتن به در بالای نگاه CSS انیمیشن کتابخانه برای کمک به شما انیمیشن های بسیار زیبا ایجاد کنید. انیمیشن ها زندگی را به وب، جنبش معنی دار شدت مطمئن UX را به سطح بعدی. شما احتمالا شنیده اصطلاح "انتقال" قبل، درست است؟ انتقال CSS چیزی را به محل در تغییر وضعیت هنگامی که شما معلق در هوا و یا چیزی است. در حال حاضر ما می توانید انیمیشن های CSS به تحریک و تشجیع هر...
رایگان
دانلود فرم جستجوی CSS3/jQuery بهمراه PSD
آموزش cssفرم جستجو بخش بسیار مهمی از یک وب سایت بوده و به کاربران اجازه می دهد ب محتوای مورد نظر را با سرعت زیاد پیدا کنند. یک فرم جستجو پیشرفته با طراحی خوب باعث می شود یک وب سایت حرفه ای و مدرن باشد.
امروز برای شما کاربرای عزیز یک فرم جستجو آماده کرده ایم که میتوانید به رایگان دانلود و استفاده...
رایگان
15 کد تب بندی شده با css و jquery
با 15 نمونه سورس تب بندی شده در خدمت دوستان هستیم که امیدواریم خوشتان آمده باشد
فایل های این مجموعه کاملا کم حجم بوده و از انیمشن های جالب و زیبا جهت باز کردن تب بندی ها استفاده گردیده که طرح را بسیار زیبا کرده است
جهت نمایش آیکون ها از svg استفاده گردیده که سرعت کار را بالا ببرد
از تگ های سکشن جهت باز شروع و اتمام تب ها استفاده شده است
آموزش تنظیمات تب بندی ها :
ما از آیکون...
رایگان
آموزش ساخت منو با css
آموزش cssسلام با آموزش ساخت منو انیمشن یا به اصطلاح متحرک در خدمت کاربران ملت وب می باشیم .
این منو کاملا با css نوشته شده است و بسیار سبک می باشد دارای طراحی فلت و زیبا می باشد .
کاملا مناسب جهت استفاده در قالب هایتان امیدوارم خوشتان آمده باشد.
کد های html
اکثر منو ها بر اساس لیست یا تگ های <UI> و <li> نوشته می شوند که این کد نیز نمونه ای از آن ها می باشد که ul به عنوان پدر...
رایگان
خصوصیت align-items در CSS
آموزش cssدر این مقاله قصد دارم نحوه ی جای گیری صحیح متن رو داخل یک تگ توضیح بدم .
فرض کنید یک تگ Div داریم که میخوایم متن Hello word رو در مرکز این تگ قرار بدیم :
برای انجام اینکار خیلی ها استفاده از خصوصیات text-align و vertical-align رو به ما پیشنهاد می دهند که خب این دو خصوصیت همیشه و به طور کامل به داد ما نمیرسه و پاسخ گوی نیاز ما نیستن اما یک راه خیلی ساده و سریع برای انجام اینکار استفاده از سه خصوصت Display و...
رایگان
قانون @import در css
در این فصل از css قصد دارم قوانینی که در css موجود هست رو خدمتتون آموزش بدم و شمارو با این قوانین آشنا کنم. در این جلسه در رابطه با قانون و یا هک @import صحبت مکنیم.
قانون @import
توسط این قانون میتونید دو فایل css رو باهم ادغام کنید. به عنوان مثال یک فایل css بنام main.css دارید و میخواین دستورات یک فایل دیگه هم بهش اضافه کنید ، میتونید به دو صورت این کار رو انجام بدید:
@import...
رایگان
کاربردهای انتخابگر target در CSS
آموزش csstarget: یکی از انتخابگرهای نوع شبه کلاس (pseudo-class) میباشد که به ما اجازه میدهد استایل مورد نظر خود را به عنصر هدف بدهیم. با استفاده از انتخابگر target میتوانیم CSS قسمتی را که روی آن کلیک شده است، تغییر دهیم.
Target موارد استفادهی بسیاری دارد. برای مثال فرض کنید جاوااسکریپت به هر دلیلی در مرورگر کاربر اجرا نشود. در اینصورت میتوانید از ترفندهای target برای...
رایگان