बूटस्ट्रैप पैनल
पैनलों
बूटस्ट्रैप में एक पैनल एक बॉर्डर वाला बॉक्स होता है जिसमें इसकी सामग्री के चारों ओर कुछ पैडिंग होती है:
एक बुनियादी पैनल
पैनल वर्ग के साथ बनाए जाते हैं .panel, और पैनल के अंदर की सामग्री में एक
.panel-bodyवर्ग होता है:
उदाहरण
<div class="panel panel-default">
<div class="panel-body">A Basic Panel</div>
</div>
.panel-defaultपैनल के रंग को स्टाइल करने के लिए क्लास का उपयोग किया जाता है । अधिक प्रासंगिक कक्षाओं के लिए इस पृष्ठ पर अंतिम उदाहरण देखें।
पैनल शीर्षक
पैनल शीर्षक
पैनल सामग्री
वर्ग पैनल में .panel-headingएक शीर्षक जोड़ता है:
उदाहरण
<div class="panel panel-default">
<div class="panel-heading">Panel Heading</div>
<div class="panel-body">Panel Content</div>
</div>
पैनल पाद लेख
पैनल सामग्री
वर्ग पैनल में .panel-footerएक पाद लेख जोड़ता है:
उदाहरण
<div class="panel panel-default">
<div class="panel-body">Panel Content</div>
<div class="panel-footer">Panel Footer</div>
</div>
पैनल समूह
कई पैनलों को एक साथ समूहित करने के लिए, a को उनके चारों ओर <div>वर्ग के साथ लपेटें।
.panel-group
.panel-groupवर्ग प्रत्येक पैनल के निचले-मार्जिन को साफ़ करता है :
उदाहरण
<div class="panel-group">
<div class="panel panel-default">
<div class="panel-body">Panel Content</div>
</div>
<div class="panel panel-default">
<div class="panel-body">Panel Content</div>
</div>
</div>
प्रासंगिक कक्षाओं वाले पैनल
पैनल को रंगने के लिए, प्रासंगिक वर्गों ( .panel-default, .panel-primary, .panel-success, .panel-info, .panel-warning, या .panel-danger) का उपयोग करें:
उदाहरण
Panel with panel-default class
Panel Content
Panel with panel-primary class
Panel Content
Panel with panel-success class
Panel Content
Panel with panel-info class
Panel Content
Panel with panel-warning class
Panel Content
Panel with panel-danger class
Panel Content