twitter-bootstrap 你能在 Bootstrap 2.3 中使用面板吗
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/19220027/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Can you use Panels in Bootstrap 2.3
提问by felix001
Is there any easy way of using bootstrap 3 panels within bootstrap 2.3. From what I can see the panels styling is a new feature within BS 3.
是否有任何简单的方法可以在 bootstrap 2.3 中使用 bootstrap 3 面板。从我所见，面板样式是 BS 3 中的一项新功能。
回答by GaneshPandian
For this your bootstrap.css code must have the styling of panels. So that you have to paste the below styles into your bootstrap.css/bootstrap.min.css file. If you are not interested in changing the core files, you can add it in your css files. you can follow the codes in http://getbootstrap.com/components/#panelsafter doing this.
为此，您的 bootstrap.css 代码必须具有面板样式。因此，您必须将以下样式粘贴到 bootstrap.css/bootstrap.min.css 文件中。如果您对更改核心文件不感兴趣，可以将其添加到您的 css 文件中。执行此操作后，您可以按照http://getbootstrap.com/components/#panels 中的代码进行操作。
.panel {
padding: 15px;
margin-bottom: 20px;
background-color: #ffffff;
border: 1px solid #dddddd;
border-radius: 4px;
-webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
}
.panel-heading {
padding: 10px 15px;
margin: -15px -15px 15px;
font-size: 17.5px;
font-weight: 500;
background-color: #f5f5f5;
border-bottom: 1px solid #dddddd;
border-top-right-radius: 3px;
border-top-left-radius: 3px;
}
.panel-footer {
padding: 10px 15px;
margin: 15px -15px -15px;
background-color: #f5f5f5;
border-top: 1px solid #dddddd;
border-bottom-right-radius: 3px;
border-bottom-left-radius: 3px;
}
.panel-primary {
border-color: #428bca;
}
.panel-primary .panel-heading {
color: #ffffff;
background-color: #428bca;
border-color: #428bca;
}
.panel-success {
border-color: #d6e9c6;
}
.panel-success .panel-heading {
color: #468847;
background-color: #dff0d8;
border-color: #d6e9c6;
}
.panel-warning {
border-color: #fbeed5;
}
.panel-warning .panel-heading {
color: #c09853;
background-color: #fcf8e3;
border-color: #fbeed5;
}
.panel-danger {
border-color: #eed3d7;
}
.panel-danger .panel-heading {
color: #b94a48;
background-color: #f2dede;
border-color: #eed3d7;
}
.panel-info {
border-color: #bce8f1;
}
.panel-info .panel-heading {
color: #3a87ad;
background-color: #d9edf7;
border-color: #bce8f1;
}
回答by Chad
If you plan to put a table inside the panel, you'll want to also add
如果您打算在面板内放置一张桌子，您还需要添加
.panel>.table, .panel>.table-responsive>.table {
margin-bottom: 0;
}
