創建的Twitter邊界框引導使用CSS3

Question

我試圖創建Twitter的引導一個負責任的盒子正是這樣：

現在，我已經創建了一個coloumn：

<div class="col-lg-4" style="border-style: solid;"> 
<h2>Title</h2> 
<p>Data</p> 

</div> 

給所有這些邊界不起作用。什麼是最好的方式？

Answer 1

也許這樣的事情？ Demo

HTML

<div class="row"> 
    <div class="col-lg-4"> 

    <h2 class="title">Python Native Datatypes</h2> 

     <div class="box"> 
      <ul> 
       <li>Data</li> 
       <li>Data</li> 
       <li>Data</li> 
      </ul> 
     </div> 
    </div> 

CSS

.box { 
border: solid 1px #000; 
padding: 10px; 
z-index:0; 
position: relative; 
width:90%; 
margin: -20px auto 0 auto; 
} 
.box li { 
list-style: none; 
} 
.title { 
background:green; 
z-index:1; 
position: relative; 
padding: 5px; 
text-align:center; 
-webkit-border-radius: 3px; 
-moz-border-radius: 3px; 
border-radius: 3px; 
color: #fff; 
font-weight: 200; 
}