رفتن به مطلب

تغییر استایل ها در بوت استرپ


پست های پیشنهاد شده

سلام

مثلا در col-lg و col-md و col-sm ، رنگ نوشته ما آبی هست

چطوری میتونم در col-xs ، رنگ اون نوشته رو تغییر بدم ؟

در کل میخوام بعضی از استایل ها رو در col-xs تغییر بدم. امکان این هست ؟

لینک به ارسال

سلام. ببینید فرم ورک اینطوری نیست که حتما باید فقط از همون برای طراحی سایتتون استفاده کنید. یکسری استایل های آماده هست که کارتون جلو بیوفته. نتیجه این که فریم ورک رو جای استایل اصلی قالب قارا ندید بذاریدش توی یه پوشه و ایمپورت یا لینکش کنید. بعدش اون قسمت هایی که نیازه رو بنا به طرح قالبتون تغییر بدید.

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

در نتیجه بعد از درج ویرایش ها چون فایل استایل اصلی بعد از فایل بوت لینک شده اونها رو پوشش میده یا اصطلاحا اورراید میکنه.

البته اگر به همه ی استایل های بوت نیازی ندارید می تونید نسخه ی مینیمال اونو دانلود کنید :

http://getbootstrap.com/customize/

البته توی این لینک میتونید به صورت زنده اونو ویرایش کنید:

http://bootstrap-live-customizer.com/

موفق باشید.

لینک به ارسال

سلام. ببینید فرم ورک اینطوری نیست که حتما باید فقط از همون برای طراحی سایتتون استفاده کنید. یکسری استایل های آماده هست که کارتون جلو بیوفته. نتیجه این که فریم ورک رو جای استایل اصلی قالب قارا ندید بذاریدش توی یه پوشه و ایمپورت یا لینکش کنید. بعدش اون قسمت هایی که نیازه رو بنا به طرح قالبتون تغییر بدید.

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

در نتیجه بعد از درج ویرایش ها چون فایل استایل اصلی بعد از فایل بوت لینک شده اونها رو پوشش میده یا اصطلاحا اورراید میکنه.

البته اگر به همه ی استایل های بوت نیازی ندارید می تونید نسخه ی مینیمال اونو دانلود کنید :

http://getbootstrap.com/customize/

البته توی این لینک میتونید به صورت زنده اونو ویرایش کنید:

http://bootstrap-live-customizer.com/

موفق باشید.

سلام

من هم طبق فایل css خودم ، قالبم رو طراحی کردم و از بوت استرپ فقط تو بعضی از جاها کمک گرفته ام

اما مثلا عکس زیر رو نگاه کنید که منوی من هست :

3544014397948114610_Untitled.png

حالا در حالت xs نگاه کنید وقتی روی علامت "بار" کلیک میکنم، جه بلایی سر منوی من میاد :

22765143979495177_Untitled.png

این بک گراند سفید ، طرح سایت من رو بهم ریخته

کلا امکان این هست که در حالت های مختلف بوت استرپ (xs-sm-md-lg) استایل ها متفاوتی به هر حالت نمایش بدهم ؟

لینک به ارسال

فکر کنم بتونید بسته به نیاز خودتون کاستوم کنید من اکثرا این کارو میکنم

لینک به ارسال

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

لینک به ارسال

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

سلام

استایل ها درست اتچ شدن .

ولی من باز هم به جوابم نرسیدم.

مثلا منوی من توی col-lg,sm,md مشکی هست ولی مثلا میخواستم توی col-xs رنگش آبی بشه

فکر کنم بتونید بسته به نیاز خودتون کاستوم کنید من اکثرا این کارو میکنم

سلام

یعنی اینکه فایل های بوت استرپ رو دستکاری و ویرایش کنم ؟

لینک به ارسال

هم اره هم نه

نه به خاطر این که اگر میخواهید فایل هاتون دست نخوره میتونید یک سی اس اس جدا هم اد کنید برخی تغییرات را در داخل اونجا قرار دهید و !important کنید دستورات رو

لینک به ارسال

سلام

استایل ها درست اتچ شدن .

ولی من باز هم به جوابم نرسیدم.

مثلا منوی من توی col-lg,sm,md مشکی هست ولی مثلا میخواستم توی col-xs رنگش آبی بشه

سلام

یعنی اینکه فایل های بوت استرپ رو دستکاری و ویرایش کنم ؟

با عرض سلام

شما از کلاس ها درست استفاده نکرده اید اونجوری که از عکس معلومه کدهای شما مشکل دارن . من ی نمونه آماده براتون قرار میدم شاید به دردتون بخوره :


<div class="menu-item col-lg-9 col-md-8">
<div class="responsive-menu col-xs-12 visible-xs">
<nav class="menu-visible">
<button data-target="#navbarcollapse" data-toggle="collapse" class="togg navbar-toggle pull-left btn-lg">
<span class="sr-only"></span>
<span class="fa fa-bars fa-2x" style="color:#000;"></span>
</button>
<div id="navbarcollapse" class="collapse navbar-collapse">
<ul class="menuxs nav navbar-nav navbar-right">
کدهای منو
</ul>
</div>
</nav>

</div>
</div>

این مربوط به حالت XS هست البته اینم بگم شما باید دوتا منو تعریف کنید یک برای حالت معمولی یکی هم برای حالت XS من حالت XS و براتون قرار دادم برای حالت معمولی + حالت XS هم میتونید از کد زیر استفاده کنید :


<div class="menu-item col-lg-9 col-md-8">
<ul class="menu-list hidden-xs">
منوهایی که در حالت معمولی نمایش داده می شوند
</ul>

<div class="responsive-menu col-xs-12 visible-xs">
<nav class="menu-visible">
<button data-target="#navbarcollapse" data-toggle="collapse" class="togg navbar-toggle pull-left btn-lg">
<span class="sr-only"></span>
<span class="fa fa-bars fa-2x" style="color:#000;"></span>
</button>
<div id="navbarcollapse" class="collapse navbar-collapse">
<ul class="menuxs nav navbar-nav navbar-right">
منوهایی که در حالت XS نمایش داده می شوند.
</ul>
</div>
</nav>

</div>
</div>

موفق و موید باشید

لینک به ارسال
  • 5 سال بعد...
در 29 دقیقه قبل، Zahra97 گفته است :

سلام من یه قالب بوت استرپ دارم چطور میتونم استایل و تغییر بدم‌ رنگ و .... 

کاربر گرامی

لطفا تاپیک های قدیمی رو بالا نیارید و یک تاپیک جدید ایجاد کنید.

لینک به ارسال

به گفتگو بپیوندید

هم اکنون می توانید مطلب خود را ارسال نمایید و بعداً ثبت نام کنید. اگر حساب کاربری دارید، برای ارسال با حساب کاربری خود اکنون وارد شوید .

مهمان
ارسال پاسخ به این موضوع ...

×   شما در حال چسباندن محتوایی با قالب بندی هستید.   حذف قالب بندی

  تنها استفاده از 75 اموجی مجاز می باشد.

×   لینک شما به صورت اتوماتیک جای گذاری شد.   نمایش به صورت لینک

×   محتوای قبلی شما بازگردانی شد.   پاک کردن محتوای ویرایشگر

×   شما مستقیما نمی توانید تصویر خود را قرار دهید. یا آن را اینجا بارگذاری کنید یا از یک URL قرار دهید.

×
×
  • اضافه کردن...