html - tutorial - bootstrap templates



আমি কিভাবে একই div দুটি বাটন মধ্যে স্থান করতে পারি? (7)

অনুভূমিকভাবে স্থান বুটস্ট্র্যাপ বোতাম সেরা উপায় কি?

মুহূর্তে বোতামগুলি স্পর্শ করছে:

<div class="btn-group">
    <button class="btn btn-inverse dropdown-toggle" data-toggle="dropdown">
        <i class="icon-in-button"></i>  
        Add to list
        <span class="caret"/>
    </button>
    <ul class="dropdown-menu">
        <li>
            <a href="#">here</a>
        </li>
        <li>
            <a href="#">new</a>
        </li>
    </ul>
    <button class="btn btn-info">
        <i class="icon-in-button"></i>  
        more
    </button>
</div>

jsfiddle সমস্যা দেখাচ্ছে: http://jsfiddle.net/hhimanshu/sYLRq/4/


Answer #1

আপনি বুটস্ট্র্যাপের জন্য স্পেসিং ব্যবহার করতে পারেন এবং কোনও অতিরিক্ত সিএসএসের প্রয়োজন নেই। শুধু আপনার বাটন ক্লাস যোগ করুন। এই সংস্করণ 4 জন্য।


Answer #2

আপনি বুটস্ট্র্যাপ v.4 ব্যবহার করা উচিত

<div class="form-group row">
    <div class="col-md-6">
        <input type="button" class="btn form-control" id="btn1">
    </div>
    <div class="col-md-6">
        <input type="button" class="btn form-control" id="btn2">
    </div>
</div>

Answer #3

আমি বুটস্ট্র্যাপ 4 বোতাম প্লাগিনটি ব্যবহার করেছি ( https://getbootstrap.com/docs/4.0/components/buttons/#button-plugin ) এবং লেবেল এবং ক্লাস এমএক্স -1 এর মধ্যবর্তী বাছাই শ্রেণিতে প্রাপ্ত বর্গ যোগ করে পছন্দসই চেহারা এবং পৃথক রেডিও বোতাম মনে। ক্লাস বিটিএন-টুলবার ব্যবহার করে রেডিও বাটন চেনাশোনাগুলি আমার জন্য প্রদর্শিত হয় যা আমি চাই না। এই কেউ সাহায্য করে আশা করি।

        <div class="btn-group btn-group-toggle" data-toggle="buttons">
            <label class="btn btn-secondary active rounded">
                <input type="radio" name="options" id="option1" autocomplete="off" checked> Active
            </label>
            <label class="btn btn-secondary rounded mx-1">
                <input type="radio" name="options" id="option2" autocomplete="off"> Radio
            </label>
            <label class="btn btn-secondary rounded">
                <input type="radio" name="options" id="option3" autocomplete="off"> Radio
            </label>
        </div>

Answer #4

এটি অর্জনের আরেকটি উপায় হল আপনার বোতামে একটি ক্লাস। বিটিএন-স্পেস যোগ করা

  <button type="button" class="btn btn-outline-danger btn-space"
  </button>
  <button type="button" class="btn btn-outline-primary btn-space"
  </button>

এবং নিম্নরূপ এই বর্গ সংজ্ঞায়িত

.btn-space {
    margin-right: 15px;
}

Answer #5

বুটস্ট্র্যাপ ব্যবহার করলে, আপনি স্টাইলের সাথে পরিবর্তন করতে পারেন: যদি আপনি শুধুমাত্র এক পৃষ্ঠায় চান তবে শিরোনামগুলি ট্যাগ করুন। বিটিএন-গ্রুপ বিটিএন {মার্জিন-ডান: 1rem;}

যদি সব ওয়েব সাইটের জন্য CSS ফাইল যোগ করুন


Answer #6

ব্রো মিরোস্ল্যাভ Popovic দ্বারা বলা হিসাবে শুধু একটি বর্গ (ক্লাস = "বিটিএন-টুলবার") বোতাম রাখুন। এটা অসাধারণ কাজ করে।

<div class="btn-toolbar">
  <button type="button" id="btnSubmit" class="btn btn-primary btn-sm">Submit</button>
  <button type="button" id="btnCancel" class="btn btn-primary btn-sm">Cancel</button>
</div>


Answer #7

btn-toolbar ভিতরে বা অন্য কিছু ধারক ভিতরে রাখুন, btn-groupbtn-group একসাথে তাদের যোগদান। বুটস্ট্র্যাপ documentation উপর আরও তথ্য।

সম্পাদনা: মূল প্রশ্ন বুটস্ট্র্যাপ 2.x এর জন্য ছিল, তবে এটি এখনও বুটস্ট্র্যাপ 3 এবং বুটস্ট্র্যাপ 4 এর জন্য বৈধ।

বুটস্ট্র্যাপ 4 এ আপনাকে ইউটিলিটি ক্লাসগুলি ব্যবহার করে আপনার গোষ্ঠীতে উপযুক্ত মার্জিন যুক্ত করতে হবে যেমন MX-2।





twitter-bootstrap