ضمن عرض سلام ، چهارمین قسمت آموزش فریم ورک محبوب بوت استرپ را تقدیمتان میکنم . ویدئو این قسمت را میتوانید از باکس زیر دانلود کنید :
| لینک دانلود | 47 مگابایت |
اما چکیده این قسمت :
از طریق 3 تگ <a> , <input> و <button> میتوان دکمه های بوت استرپی تولید کرد . ابتدا کلاس btn را به آن نسبت میدهیم ، این کلاس به 3 تگ مذکور حاشیه اضافه میکند اما دکمه بوت اسرپی ما هنوز آماده نیست ؛ برای رنگبندی دکمه باید از یکی کلاس های btn-default , btn-primary , btn-success , btn-info , btn-warning , btn-danger استفاده میکنیم :
|
1 2 3 4 |
<a class="btn btn-default" href="#" role="button">Link</a> <button class="btn btn-default" type="submit">Button</button> <input class="btn btn-default" type="button" value="Input"> <input class="btn btn-default" type="submit" value="Submit"> |
برای تغییر سایز دکمه ها در بوت استرپ میتوان از کلاس های btn-lg ، btn-sm و btn-xs استفاده کرد :
|
1 2 3 4 |
<button type="button" class="btn btn-primary btn-lg">Large button</button> <button type="button" class="btn btn-primary">Default button</button> <button type="button" class="btn btn-primary btn-sm">Small button</button> <button type="button" class="btn btn-primary btn-xs">Extra small button</button> |
و اما چند کلاس برای عکس ها :
برای اینکه عکس درون صفحه ما از حاشیه بیرون نزند و رسپانسیو باشد کلاس img-responsive را به تگ <img> نسبت میدهیم :
|
1 |
<img src="..." class="img-responsive" /> |
برای جلوه دادن به عکس از کلاس های img-rounded ، img-circle و img-thumbnail استفاده میشود :
|
1 2 3 |
<img src="..." class="img-rounded"> <img src="..." class="img-circle"> <img src="..." class="img-thumbnail"> |
و اما کلاس های هشدار :
با اضافه کردن هرکدام از کلاس های text-muted ، text-primary ، text-success ، text-info ، text-warning و text-danger میتوان رنگ متن درون هر تگ را تغییر داد :
|
1 2 3 4 5 6 |
<p class="text-muted">...</p> <p class="text-primary">...</p> <p class="text-success">...</p> <p class="text-info">...</p> <p class="text-warning">...</p> <p class="text-danger">...</p> |
همچنین با اضافه کردن هر کدام از کلاس های bg-primary ، bg-success ، bg-info ، bg-warning ، و bg-danger متن تگ را درون یک باکس رنگی قرار داد :
|
1 2 3 4 5 |
<p class="bg-primary">...</p> <p class="bg-success">...</p> <p class="bg-info">...</p> <p class="bg-warning">...</p> <p class="bg-danger">...</p> |
یه سری کلاس دیگه هم هست که در انتهای ویدئو این قسمت توضیح داده شده است.
دمت گرررررررممممم……
به امید آموزش بوت استرپی دیگر
🙂
مرسی تشکر
آقای شفیعیان ممنون بابت زحماتتون
مشتاقانه منتظر ادامه آموزش ها هستم
لطفا وقتی این آموزش ها تمام شد یه آموزش پروژه محور از اول طراحی قالب تا انتهای بارگذاری در سایت هم به صورت بخش بخش آموزش بدید.
ممنون از لطف و زحماتتون
و این که نحوه اتصال مثلا قسمت های مختلف به پایگاه داده ،نحوه تعریف پایگاه داده ها و…..
راستیتش خیلی دوست داشتم طراحی سایت یاد بگیرم سایت های مختلفی هم رفتم برا دانلود ولی به نظرم آموزش های شما خیلی خوبه
ممنون
مرسی از لطف شما
بله به امید خدا دوره های جدیدی شروع خواهم کرد
خواهش میکنم دوست گرامی
بله چشم , در پایان چند نمونه پروژه با همدیگه کار خواهیم
موفق باشید
سلام حسین جان
بابت اموزش خیلی ممنون وتشکر که به فکر مایی
به امید اموزش های عالی
سلام آقا رضا
تشکر از حمایتتان
Like
😉
سلام بسیار متشکرم بابت این آموزش عالی هرچند خیلی دیر رسید ولی رسید بازهم ممنون
سلام و تشکر از حمایت شما
به امید خدا روند ادامه آموزش ها را دوباره آغازخواهم کرد
دست شما درد نکنه.کاش زود به زود آموزش بزارین
مرسی , سعی میکنم برای آموزش های آینده تایمی را در طول هفته در نظر بگیرم
سلام
قسمت سوم رو که گذاشتید من دانلود کردم همون روز
بعدش رفتم سربازی و امروز بعد از دو ماه اموزشی امدم میبینم فقط یک قسمت اضافه شده!!!!!!!!!!!!!!1
اقا کارت درسته ما حسابی مشتری شدیم
یکم زودتر اموزشا رو بزار اخویی
یا حق
سلام
واقعا دو ماه گذشت ؟؟!!!! چقدر زود میگذره ! 😀
مرسی از ارسال نظر و امیدوارم آش خوری بهت ساخته باشه
مرسی حسین 🙂
خواهش
Thanks Hossein Jan
خواهش میکنم مهران جان
با تشکر از آموزش خوبتون
خواهش میکنم
با سلام.
با تشکر از زحمات فراوان شما.
مطالبی بسیار مهم و آموزنده وکاربردی در اختیار کار بران گذاشتید اما حیف نیست بصورت رایگان انتشار میکنید؟؟؟
سلام ، خواهش میکنم
هدف بنده از این سایت کسب درآمد نیست و تمایل بنده به انتظار آموزه ها و تجارب شخصی بنده بصورت آزاد برای عموم است
مرسی
سلام آقای شفیعیان
من شب عید یه کامنت گذاشتم شما گفتید بعد از شهریور آموزشا رو شروع می کنم الان هم که مهرماه هست و خبری نیست
من پیشنهاد می کنم وقتی شروع کردید یه آموزش رو به طور کامل جلو ببرید بعد برید سراغ آموزشا دیگه لازم هم نیست کد های آموزش زیر پست قرار بدید وقت خودتون گرفته میشه همون تو فیلم کفایت می کنه
این آموزش بوت استرپ اولویت زیادی داره برای مخاطبا اگه اینو آماده کنید ممنون تون میشم
حداقل جمعه ها یک ویدیو تهیه کنید
در ضمن در این جلسه یه قالب درست کردید که اسمش ایکس تم بود که قرار شد لینکشو بذارید که نذاشتید
سلام
بله دارم مقدمه چینی های لازم را انجام میدم که سایت دوباره نخوابه ، بزودی …
در مورد قالب بنده گفتم احتمالش هست که رایگان منتشر کنم و قول صد در صد ندادم !
واقعا عالی!
سلام از آموزشای خوبتون ممنونم خدا خیرتون بده فقط ببخشید این فیلم دانلود نمیشه ….
سلام ، تشکر
برسی میکنم…
آقا خدا خیر ت بده تا عمر دارم میدیونتم
خواهش میکنم
عالی بود حسین مرسی.
خواهش میکنم ، تشکر
مثل همیشه عالی.
مستدام باشید.
ممنون
خیلی عالی بود واقعاً استفاده کردم.
خیلی عالیییییییییییییی.
حرف نداره
ممنون از اموزشتون،
من موفق به دریافت این فیلم نشدم.
خاهش ، تست شد مشکلی نیست !
حاجی خدایی لایک داری….دمت گرم..واقعا همه مطالب سایتت عالیه.دمت