बूटस्ट्रैप कंटेनर बॉक्स

Twitter Bootstrap Scaffolding फ्लूइड लेआउट पर अनुभाग उदाहरण कोड दिखाता है जो दो नीले रंग के बक्से के रूप में प्रदर्शित होता है। उस उदाहरण का उपयोग करके, नीचे दिया गया कोड, "साइडबार सामग्री बॉडी सामग्री" प्रदर्शित करता है लेकिन कोई बॉक्स नहीं। और क्या चाहिए?बूटस्ट्रैप कंटेनर बॉक्स

<!DOCTYPE html> 
<html> 
<head> 
<link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/css/bootstrap-combined.no-iconhttp://twitter.github.io/bootstrap/scaffolding.htmls.min.css" rel="stylesheet"> 
</head> 
<body> 
<div class="container-fluid"> 
    <div class="row-fluid"> 
    <div class="span2"> 
     Sidebar content 
    </div> 
    <div class="span10"> 
     Body content 
    </div> 
    </div> 
</div> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 
<script src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/js/bootstrap.min.js"></script> 
</body> 
</html>

स्रोत

2013-07-20 C.W.Holeman II

आप नीले बॉक्स उन सिर्फ संदर्भ के लिए वहाँ प्रदर्शित किए जाते हैं को देखने के लिए बाहर बात करने के लिए कैसे ग्रिड बांटा गया है की कोशिश कर रहा है और कर रहे हैं। वे वास्तव में कोड में शामिल करने के लिए नहीं हैं। साइडबार सामग्री और बॉडी कंटेंट शब्द आपके संदर्भ बिंदु हैं जहां सामग्री प्रदर्शित की जाएगी। कुछ छायांकन प्राप्त करने के लिए आपको अपने span2 और span10 divs के बगल में एक सीएसएस क्लास जोड़ने की आवश्यकता होगी। यहाँ एक उदाहरण है:

<div class="span2 well"> 
    Sidebar content 
</div>

स्रोत

2013-07-20 22:57:24

बूटस्ट्रैप डॉक्स एक अतिरिक्त शैली संपत्ति show-grid कि span* (कॉलम) पर एक पृष्ठभूमि (बक्से) पंक्तियों के अंदर प्रदर्शित करने के लिए प्रयोग किया जाता है है। सीएसएस इस तरह दिखता है:

.show-grid [class*="span"] { 
    background-color: #ddd; 
}

और इस तरह डॉक्स में पंक्तियों के लिए आवेदन किया है ..

<div class="row-fluid show-grid"> 
    <div class="span2"> 
     Sidebar content 
    </div> 
    <div class="span10"> 
     Body content 
    </div> 
</div>

डेमो: http://www.bootply.com/68856

स्रोत

2013-07-21 10:35:19 ZimSystem

बूटस्ट्रैप कंटेनर बॉक्स

उत्तर

संबंधित मुद्दे