创建一个类似Bootstrap的框

时间:2013-11-27 13:51:48

标签: jquery html css twitter-bootstrap

我想在bootstrap样本中创建一个盒子?我想创建一个类似于此的框:

enter image description here

这是用bootstrap还是用一些CSS创建的?我到目前为止尝试的只是这个:

<div class="thumbnail clearfix">
    test
</div>

这只会创建外部框,但我也希望有一个类似于该样本的框和下边距

1 个答案:

答案 0 :(得分:1)

这不是bootstrap.css的一部分...... Bootstrap 2.x文档包含用于创建示例块的自定义CSS ..

.bs-docs-example {
position: relative;
margin: 15px 0;
padding: 39px 19px 14px;
background-color: #fff;
border: 1px solid #ddd;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
}

.bs-docs-example:after {
content: "Example";
position: absolute;
top: -1px;
left: -1px;
padding: 3px 7px;
font-size: 12px;
font-weight: bold;
background-color: #f5f5f5;
border: 1px solid #ddd;
color: #9da0a4;
-webkit-border-radius: 4px 0 4px 0;
-moz-border-radius: 4px 0 4px 0;
border-radius: 4px 0 4px 0;
}

http://bootply.com/97038