site

بهم ریختگی قالب هنگام استفاده از بوت استرپ

7 پست در این موضوع قرار دارد

سلام دوستان

وقتی که کدهای زیر رو به قالب اضافه میکنم ، قالب یکم بهم میخوره . بهم خوردگی به طوری که متن ها از کادر ها فاصله میگیرن و ...

کدها :


<link href="css/bootstrap.min.css" rel="stylesheet" type="text/css">
<script src="js/bootstrap.min.js"</script>
<script src="js/jquery-2.1.4.min"</script>

عکس :

706614365604766000_boooot.png

برای رفع این مشکل باید چیکار کنم ؟

من از reset.css فشرده هم استفاده می کنم.

از بوت استرپ rbootstrap.ir استفاده می کنم

0

به اشتراک گذاری این پست


لینک به پست

سلام داداش

طبیعیه! چون استایل جدید داری اضاقه میکنی!

باید دستی از طریق css درستش کنی

1

به اشتراک گذاری این پست


لینک به پست

فایل فوق رو باز کنید و ببینید کدوم قسمتش روی قالب شما تاثیر میذاره

<link href="css/bootstrap.min.css" rel="stylesheet" type="text/css">

1

به اشتراک گذاری این پست


لینک به پست

ارسال شده در (ویرایش شده)

سلام داداش

طبیعیه! چون استایل جدید داری اضاقه میکنی!

باید دستی از طریق css درستش کنی

سلام و ممنون

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

اما به یکباره بهم ریخت.

آخه به نظرم با اضافه شدن بوت استرپ چیزی نباید عوض بشه چون در طراحی قالب من ، اسم کلاس های css من 100 درصد با اسم کلاس های بوت استرپ فرق میکنه

فایل فوق رو باز کنید و ببینید کدوم قسمتش روی قالب شما تاثیر میذاره

<link href="css/bootstrap.min.css" rel="stylesheet" type="text/css">

سلام

منظورتون رو کامل متوجه نشدم

ویرایش شده در توسط site
0

به اشتراک گذاری این پست


لینک به پست

نسبت دادن خاصیت ها فقط به کلاس ها محدود نمیشوند ، ممکنه به بعضی از تگ ها هم خاصیت داده باشد مثلا به همه div ها یا h1 ها....

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

هدفتون از استفاده از فریم ورک چیست؟

1

به اشتراک گذاری این پست


لینک به پست

نسبت دادن خاصیت ها فقط به کلاس ها محدود نمیشوند ، ممکنه به بعضی از تگ ها هم خاصیت داده باشد مثلا به همه div ها یا h1 ها....

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

هدفتون از استفاده از فریم ورک چیست؟

سلام و ممنون

میخوام قالب رو رسپانسیو کنم

خب با استفاده از reset.css مشکل حل نمیشه ؟

اگه اینجوری باشه که باید با همه قالب ها تداخل داشته باشه !

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

0

به اشتراک گذاری این پست


لینک به پست

ارسال شده در (ویرایش شده)

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

خب فریم ورک چون خیلی از موارد رو به صورت پیش فرض تعریف میکنه اصلا نیازی نیست خیلی از قسمت ها بعضی از خواص را بگیرند مثلا ممکنه فریم ورک برای یک تگ h3 ،

margin-top در نظر گرفته باشه و بعد شما بیاید و مثلا line-height را برابر 50px قرار بدید طبیعیه که بیش از اندازه از بالا فاصله میگیره. این یه مثال بود کلیت هم همینه.

--------------------------------

برای ریسپانسیو کردن اگر مهارتتون در زمینه css بالاست میتونید با مدیا کوئری ریسپانسیو کنید.

در مورد ریست سی اس اس ، این فایل برای ریست مقادیر پیش فرضیست که مروگرها در نظر میگیرند مثل padding & margin or ........... و ربطی به موضوع بحث ما نداره.

منظور من اینه که اون قسمت از قالب شما که به هم میریزه ممکنه از بوت استرپ هم استایل بگیره! خب اگر بوت استرپ روی اون تاثیر نمیذاشت پس چرا پس از متصل کردن بوت استرپ به هم میریزه؟ پس خروجی را روی مرورگرتون با فایرباگ یا هر ابزاری چک کنید و ببینید قسمت به هم ریختگی چه استایل هایی میگیره ، تنها راه هم همینه ، در ضمن با مقایسه خروجی روی مرورگر در دو حالت میتونید علت را بیابید.

اگر علت همینی بود که گفتم داخل فایل css هر بخشی را اصلاح کردید بعدش یه important! قرار بدید که مرورگر این استایل را به بیقیه ترجیح بده.

موفق باشید

ویرایش شده در توسط وردپرس-و-دیگر هیچ
1

به اشتراک گذاری این پست


لینک به پست

برای ارسال نظر یک حساب کاربری ایجاد کنید یا وارد حساب خود شوید

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

ایجاد یک حساب کاربری

برای حساب کاربری جدید در انجمن ما ثبت نام کنید. عضویت خیلی ساده است !


ثبت نام یک حساب کاربری جدید

ورود به حساب کاربری

دارای حساب کاربری هستید؟ از اینجا وارد شوید


ورود به حساب کاربری