تبلیغات
طراحی و بهینه سازیمشاهده

هاست

آموزش ساخت تب جی کوئری و سی اس اس

CSS , HTML5 , اسکریپت ها , جی کوئری , ديگر اسكريپتها , متفرقه

در این مطلب از سایت بیست اسکریپت ساخت یک تب زیبا با استفاده از فناوری جی کوئری و سی اس اس را آموزش میدهیم. در کد نویسی اسکریپت حاضر از جی کوئری و سی اس اس استفاده شده و با طرح و فرم مدرن و زیبایی که دارد نمای متفاوتی را به وبسایت شما هدیه می دهد. هم اکنون جهت مشاهده آموزش با ما باشد.

آموزش ساخت تب جی کوئری و سی اس اس 

بخش اول HTML :

خوب کد های زیر را به هر جایی از قالب خود که می خواهید اضافه کنید.

 

 همون طوری که مشاهده می کنید بخش HTML از یک لیست مرتب با آی دی nav و یک عنصر div با کلاس list-wrap تشکیل شده که قسمت اول برای عنوان تب ها و بخش دوم برای محتوای آن ها می باشد. به آدرس لینک های لیست nav و ID لیست های داخلی عنصر div با کلاس list-wrap دقت کنید.

بخش دوم CSS :

استایلی که در این بخش به عناصر تعریف شده یک استایل ساده است که فقط برای اصلاح ظاهر برگه ها هست و به راحتی می تونید این بخش رو مناسب طراحی خود تغییر دهید. این استایل را به فایل مورد نظر اضافه کنید.

 بخش سوم جی کوئری :

در نهایت قسمت جی کوئری برای ایجاد افکت هنگام تغییر برگه ها می باشد.

طریقه استفاده از پلاگین بالا :

کد بالا برای دو تب بندی نوشته شده است.

لطفا به این مطلب امتیاز بدید


دانلود


هاست مناسب برای تمامی اسکریپت های 20script MyHBD.net >
مطلب مفیدی بود ؟
نویسنده : تیم محتوای 20اسکریپت 10 CSS , HTML5 , اسکریپت ها , جی کوئری , ديگر اسكريپتها , متفرقه

لینک کوتاه مطلب : https://www.20script.ir/?p=8275

کلمات کلیدی پست :
درگاه پرداخت
مطالب مرتبط
7,111دانلود قالب وردپرس میهن مووی تاریخ : 2015/03/12
12,363افزونه ساخت پروفایل کاربری آسان در وردپرس User Profiles Made Easy نسخه 2.3.09 تاریخ : 2019/02/21
5,606دانلود قالب فروشگاهی Suave نسخه 1.6.1 برای وردپرس تاریخ : 2016/02/9
3,997دانلود سیستم مدیریت محتوا دروپال Drupal فارسی نسخه 7.41 تاریخ : 2016/02/7
3,768اسکریپت اشترک گذاری فیلم و عکس Mediaplus تاریخ : 2016/02/12
21,760قالب وردپرس دانلود فیلم و سریال زیگما تاریخ : 2014/10/20
86,184اسکریپت ربات هوشمند اینستاگرام GramEasy نسخه 6.5 تاریخ : 2019/08/28
4,856قالب شرکتی Softone به صورت HTML تاریخ : 2014/10/22
7,150اسکریپت مدیریت محتوا دایرکتوری eDirectory نسخه 10.3 تاریخ : 2016/04/19
6,711اسکریپت شبکه اجتماعی Socialkit نسخه 1.3.3 تاریخ : 2015/04/14
8,644اسکریپت چت روم فارسی Ready Chat نسخه 1.3 تاریخ : 2014/04/1
6,215دانلود پوسته وردپرس آسترو Astro نسخه 4.1 تاریخ : 2016/02/28
برخی از قالب های وبلاگ - بیست اسکریپت
قالب عشق بین انگشت ها
قالب دخترونه و آرایش
قالب زیبای ماشین
قالب فانتزی و طنز چِشم
قالب دختر رویایی
قالب وبلاگ دکوراسیون
قالب وبلاگ کلبه و درخت
قالب دختر زیبا
قالب پسرونه غمگین
قالب عاشقانه قلب