我们在引导程序中是否有任何Group Box

在我的一个应用程序中，我们需要一个像功能一样的组框，就像下图所示，我们使用的是Twitter Bootstrap 3 css。我搜索了Bootstrap 3中是否有这样的功能，但找不到任何，我不知道我是否缺少任何，因为当时我创建了自己的CSS来创建类似的结构，但似乎没那么好。我们在引导程序中是否有任何Group Box

谁能告诉我像这样的自举3个可用的任何组件

CSS

table { 
    border-collapse:separate; 
    border:solid #2e6da4 1px; 
    border-radius:6px; 
    -moz-border-radius:6px; 
} 

td, th { 

    border-left:solid #2e6da4 1px; 
    border-top:solid #2e6da4 1px; 
} 

th { 
    background-color: #337ab7; 
    border-top: none; 
} 

td:first-child { 
    border-left: none; 
}

JSFiddle

enter image description here

来源

2015-04-17 Alex Man

你可以只使用COL-MD-3〜4次的行有4个'groupboxes' –

https://jsfiddle.net/DTcHh/6752/像这样 –

http://getbootstrap.com/components/#panels –

您可以从引导尝试面板： Demo

HTML：

<div class="panel panel-default"> 
    <div class="panel-heading">Panel heading without title</div> 
    <div class="panel-body"> 
    Panel content blah <br/>blah <br/>blah <br/>blah <br/>blah <br/>blah <br/>blah <br/>blah <br/>blah <br/>blahblah <br/>blah <br/>blah <br/>blah <br/>blah <br/>blah <br/>blah <br/>blah <br/>blah <br/>blah 
    </div> 
</div>

是，您可以：Demo

使用panel-primary为蓝色。欲了解更多信息Reference Link

<div class="panel panel-default">...</div> 
<div class="panel panel-primary">...</div> 
<div class="panel panel-success">...</div> 
<div class="panel panel-info">...</div> 
<div class="panel panel-warning">...</div> 
<div class="panel panel-danger">...</div>

来源

2015-04-17 11:50:32

面板是要走的路！ –

节省了我的时间..谢谢G.L.P –

欢迎空指针:) –

也有一些是几乎正是这种在基本自举的例子。 http://getbootstrap.com/examples/theme/

他们称之为 “板” 下面的代码：从引导

<div class="panel panel-default"> 
    <div class="panel-heading"> 
     <h3 class="panel-title">Panel title</h3> 
    </div> 
     <div class="panel-body"> 
      Panel content 
     </div> 
</div>

来源

2015-04-17 11:52:08

使用面板：Demo

<div class="col-lg-3 col-md-3 col-sm-3"> 
    <div class="panel panel-primary"> 
     <div class="panel-heading">Panel heading without title</div> 
     <div class="panel-body">Panel content blah 
      <br/>blah 
      <br/>blah 
      <br/>blah 
      <br/>blah 
      <br/>blah 
      <br/>blah 
      <br/>blah 
      <br/>blah 
      <br/>blahblah 
      <br/>blah 
      <br/>blah 
      <br/>blah 
      <br/>blah 
      <br/>blah 
      <br/>blah 
      <br/>blah 
      <br/>blah 
      <br/>blah</div> 
    </div> 
</div>

来源

2015-04-17 11:55:58

我们在引导程序中是否有任何Group Box

回答

相关问题