رفتن به مطلب

تاپيك سوالات و نظرات آموزش بوت استرپ 3


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

سلام دوستان لطف كنن سوالات مشكلات و نظرات خودشون رو درباره تاپيك آموزش بوت استرپ در اينجا قرار بدن.

لینک به ارسال

فریم ورک به این راحتی :D من مشکلم بیشتر توی ساخت یک row یا یک باکس نامرئی هستش و اینکه بتونم سفارشیش هم بکنم تنها مشکلم توی بوت استراپ همینه که بلد نیستم ... -_-

لینک به ارسال

چشم شما صبر كنيد ما وارد اصل كار بشيم اين مسائل رو هم توضيح ميديم !‌ درباره نامرئي بودن باكس ! باكس شما به چي ميگين باكس ؟!‌

اگه منظورتون col ها هست بله ميشه نامرئي كرد و جزء مبحث هامون هست كه فرض يك col در صفحه هاي نمايش بزرگ نمايش داده بشه و در صفحه هاي نمايش كوچتر نمايش داده نشه .... !‌

لینک به ارسال

خیلی خوب هست که چنین آموزشی رو شروع کردید

خودم هم نیاز داشتم تا یاد بگیرم :)

لینک به ارسال

سلام

به عنوان مثال می خوایم یه سری محتوا رو رو روزولیشن خاص مخفی کنیم. مثلا برای گوشی ها 2 تا ستون اول فوتر حذف بشه. با بوت استرپ به چه صورته؟ نیاز به نوشتن مدیا که نداره؟

لینک به ارسال

دوستمون در بالا هم فك كنم همين رو خواستن كه نامرئي بشه ! جزوه آموزش ها هست ولي اين مورد اينجا ميگم حالا .....

به كلاس مورد نظرتون اين كلاس رو هم اضافه كنيد :


.hidden-xs
.hidden-md
...
...
...

به فرض گزينه اول داخل صفحه هاي موبايل نمايش داده نميشه .... !

لینک به ارسال

ادامه كه ميديم ! ما هم خب ي سري مشكلات و مسائلي داريم براي خودمون !‌ ي زره سرم خلوت بشه آموزش بعدي ميزارم ..... !

سعي ميكنم زود به زود بزارم !

لینک به ارسال

ادامه بده عزیز

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

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

و به نظرم بهتره که یه تاپیک مجزا درست کنید و توش فقط آموزش باشه و سوالات یه جای دیگه باشه.

موفق باشید

لینک به ارسال

دوست عزیز FAVER اینجا تاپیک بیان نظرات در مورد آموزش بوت استراپ هست واسه رفتن به تاپیک آموزش بوت استراپ به لینک زیر برو :

موفق باشید.

لینک به ارسال
  • 2 هفته بعد...

کامپوننت منو یه حال داره که وقتی قالب تغییر حالت میده منو میره داخل یه دکمه. چجوری میشه اندازه هایی که منو تبدیل به دکمه میشه رو تغییر داد؟ مثلا من می خوام رو تبلت ها اون اتفاق نیوفته.

لینک به ارسال

بله ! خاصيتش همين هست اندازه از ي حدي كوچكتر بشه منو به صورت يك دكمه زير منو دار تبديل ميشه !‌ اين اندازه هاي غالبا" فك كنم داخل فايل هاي less بوت استرپ باشن و مديا باشن كه بشه تغيير داد ! دقيق بگم نميدونم ! شما فايل هاي less ي نگاهي بندازين من هم ميبينم بازم شايد به نتيجه رسيدم !

اين هم ي نگاهي بندازين :

http://stackoverflow.com/questions/10094479/prevent-menu-from-collapsing-in-768px-display-css-media-query

لینک به ارسال
  • 3 هفته بعد...

بابت آموزش خوبتون ممنون .

تو جلسه دوم و مثال 2 یک قالب کلی ایجاد کردید . چرا هر قسمت رو درون یک container جدا گذاشتین ؟

با اینکه محتوا رو 8 و ساید بار رو 4 در نظر گرفتید اما کنار هم واقع نمیشن .

تو بوت استرپ 2 من یدونه container میزاشتم و همه چیز درون اون قرار میگرفت . الان مثال شما رو اینطور نوشتم :


<div class="Containers">
<div class="row">
<div class="col-md-12 col-xs-12 col-sm-12 "> header</div>
</div><!-- row -->

<div class="row" style="background-color:#CC99FF">
<div class="col-md-8 col-xs-12 col-sm-9 " style="background-color:#FFCC33">content</div>
<div class="col-md-4 col-xs-12 col-sm-3 " style="background-color:#FFCCCC">sidebar</div>
</div><!-- row -->

<div class="row" style="background-color:#00CCFF">
<div class="col-md-12 col-xs-12 col-sm-12 ">footer</div>
</div><!-- row -->

</div><!-- container -->

لینک به ارسال

سلام خواهش ميكنم !‌ من خودم هم ميخواستم ياد بگيريم در كنار آموزش هايي ميخوندم قالب هاي حرفه ايي رو هم كه در تم فارست يا سايت هاي معروفي كه قالبشون رو با بوت استرپ زدن نگاه ميكردم !

http://www.bsstc.com.au

https://www.engineyard.com

اين دو تا مثال كه خودتون هم برگردين شايد چيزهاي بهتري پيدا كنيد !‌ واگه دقت كنيد داخلش واسه تقسيم بندي صفحه يك container خيلي كم هست !‌ كم كمش همون 3 تا رو لازم داره براي 1-هدر 2-محتوا و سايدبار 3-فوتر! اين چيزي بود كه من توي اكثر قالب ها ديدم رعايت شده بود و من رعايت كردم و به شما دوستان گفتم ! مگر نه بله خود بوت استرپ چند تا قالب ساده داره كه با يك container نوشته !‌ اين مورد كه سايدبار ميوفته پايين فك كنم ي row اضافه گذاشتم ! اين مثال هم صرفا واسه يادگيري كلي تقسيم بندي بود كه چي به چي هست ....بفرماييد :

http://www.bootply.com/121159

لینک به ارسال

ممنونم . یک سوال دیگه .

تو بوت استرپ 2 , کلاس container عرضش 940 تعریف شده بود و وسط بود . اینجا اما براش عرضی تعریف نشده .

بهتره این کد رو به کلاس container اضافه کنیم یا یک کلاس جدا بنویسیم و صدا بزنیم ؟

width : 940 px;

margin:auto;

میخوام بدونم راه اصولی تر و بهتر کدومه ؟

لینک به ارسال

سلام

با اجازه RedPlus عزیز

دیگه نیازی به اندازه دادن نیست. استاندارش اینه که شما یه col-md-12 تعریف کنی که کل صفحه رو بگیره. بعد داخلش رو تقسیم بندی کنی.

لینک به ارسال

ممنونم . منظورم اینه که بعنوان مثال تو این کدی که آقای RedPlus دادن (http://www.bootply.com/121159

) چطوری قسمت container وسط که سایدبار و محتوا رو در بر داره , وسط چین بشه و عرض 940 ؟

چون الان تمام صفحه هستش . راه بهتر رو میخوام . اگه

col-md-12 رو دوباره درونش تعریف کنم باز تمام صفحه هست . تقسیم بندی هم که کنم , باز باید کلاس های

col-md-12 و ... رو دست کاری کنم .

لینک به ارسال

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


<div class="containser main">
.
.
.
</div>

لینک به ارسال

فهمیدم مشکل چی بود . من طبق کد آقای Redplus نوشتم و ایشون از کلاس Containers استفاده کردند , در صورتی که اگه از container استفاده کنیم پیش فرض وسط هست .

و کلاس container-fluid هم بصورت 100 درصد تمام عرض مرورگر رو میگیره .

کلاس Containers رو هم در CSS ندیدم .

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

دوستان یک ستون دارم با عرض col-md-4

میخوام این ستون رو به 3 قسمت افقی تقسیم کنم . کدوم بهینه تر و درست تره ؟

خلاصه ی کد ( container و row های قبلش رو نزاشتم )

کد اول :


<div class="col-md-4" >
<div class="row">
<div class="col-md-12">col1</div>
<div class="col-md-12">col1</div>
<div class="col-md-12">col1</div>
</div>
</div>

کد دوم :


<div class="col-md-4">
<div class="row">
<div class="col-md-12">col1</div>
</div>
<div class="row">
<div class="col-md-12">col1</div>
</div>
<div class="row">
<div class="col-md-12">col1</div>
</div>
</div>

سایتی هست که مثال های کوتاه و خوبی برای ایجاد قالب کلی بوت استرپ داشته باشه ؟ چون میخوام بهینه بنویسم و خیلی سلیقه ای نشه . ممنونم

ویرایش شده توسط pary_daryayi
لینک به ارسال
  • 2 هفته بعد...

سلام ببخشيد كمي تاخير در جواب به وجود اومد ! بله اين سايت و سايت هاي ديگري مث اين وجود داره كه اين از همه معروف تر هست ! هم كد ميتونيد بنويسيد هم در صورتي كه ثبت نام كرده باشيد به صورت ويژوال ي جورايي طراحي كنيد !‌

http://bootply.com

براي اين سوالتون هم بفرماييد بهترين حالت :

http://getbootstrap....s/#grid-nesting

لینک به ارسال
  • 2 ماه بعد...

سلام . من تو panel-footer این رو دارم "


<div class="panel-footer text-right">
<div class="dir-rtl ">
<span style="margin-right:20px"><?php echo btn_edit(NULL)?> : ویرایش مطالب</span>
<span style="margin-right:20px"><?php echo btn_delete(NULL)?> :انتقال به زباله دان</span>
<span style="margin-right:20px"><?php echo btn_check(NULL)?> : فعال کردن امکان نظر دهی</span>
<span style="margin-right:20px"><?php echo btn_uncheck(NULL)?> : غیر فعال کردن امکان نظر دهی</span>
</div><!-- dir-rtl-->
</div><!-- panel-footer -->

که خروجی تصویر رو گذاشتم :

میخوام تو موبایل این بی نظمی از بین بره . تصویر دوم حالت موبایل هست :

برای این ، از چی استفاده کنم ؟ یعنی تقسیم بندی ستونی انجام بدم که همشون زیر هم قرار بگیرند ؟

راه بهتر هم وجود داره ؟

مثلا مثل کلاس table-responsive یک اسکرول افقی بخوره ؟

post-1361-0-83693700-1401714173_thumb.jp

post-1361-0-49588400-1401714217_thumb.jp

لینک به ارسال

سلام. به این صورت استفاده کنید


<div class="col-md-12 col-xs-12">
<div class="dir-rtl ">
<span class="col-md-12 col-xs-12" style="margin-right:20px"><?php echo btn_edit(NULL)?> : ویرایش مطالب</span>
<span class="col-md-12 col-xs-12" style="margin-right:20px"><?php echo btn_delete(NULL)?> :انتقال به زباله دان</span>
<span class="col-md-12 col-xs-12" style="margin-right:20px"><?php echo btn_check(NULL)?> : فعال کردن امکان نظر دهی</span>
<span class="col-md-12 col-xs-12" style="margin-right:20px"><?php echo btn_uncheck(NULL)?> : غیر فعال کردن امکان نظر دهی</span>
</div><!-- dir-rtl-->
</div><!-- panel-footer -->

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

ممنونم . بله با استفاده از تقسیم بندی ستونی رو میدونم .

در پست قبلی هم گفتم ، میخوام بدونم غیر از تقسیم بندی ستونی ، راه بهتر دیگه ای هست ؟ مثلا در حالت xs مثل جداول که در حالت responsiv اسکرول دار میشن ( افقی ) این هم به همین شکل بشه .

لینک به ارسال

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

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

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

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

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

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

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

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

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