一個列表和兩列無序

Question

我想在兩列中顯示一個列表。

左邊的奇數，右邊的偶數。

這就是我的意思是：

+----------------------------------------------------+ 
|     col-md-9      | 
+------------------------+---------------------------+ 
|  1.     |  2     | 
|  3.     |  4.     | 
|  5.     |  6.     | 
|  7.     |  8.     | 
|  9.     |  10.     | 
|      |       | 
|      |       | 
|      |       | 
|      |       | 
+------------------------+---------------------------+ 

，我的代碼是：

<div class="col-md-9"> 
    <ul> 
     <li>1.</li> 
     <li>2.</li> 
     <li>3.</li> 
     <li>4.</li> 
     <li>5.</li> 
     <li>6.</li> 
     <li>7.</li> 
     <li>8.</li> 
     <li>9.</li> 
     <li>10.</li> 
    </ul> 
</div> 

我怎樣才能做到這一點？ ps：要擴大名單，我使用while（）循環

Answer 1

請檢查全屏幕我有使用md所以目前它將顯示在每行1 li。

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> 
 
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" /> 
 
<div class="col-md-9"> 
 
    <ul class="row"> 
 
    <li class="col-md-6">1.</li> 
 
    <li class="col-md-6">2.</li> 
 
    <li class="col-md-6">3.</li> 
 
    <li class="col-md-6">4.</li> 
 
    <li class="col-md-6">5.</li> 
 
    <li class="col-md-6">6.</li> 
 
    <li class="col-md-6">7.</li> 
 
    <li class="col-md-6">8.</li> 
 
    <li class="col-md-6">9.</li> 
 
    <li class="col-md-6">10.</li> 
 
    </ul> 
 
</div>

Answer 2

對於引導dislikers在我們中間：

<style> 
 
    .ul-two-cols { 
 
     display: block; 
 
     width: 100%; 
 
     listItemStyle: none; 
 
     position: relative; 
 
    } 
 
    .ul-two-cols > li { 
 
     display: inline-block; 
 
     width: 49%; 
 
    } 
 
</style> 
 
<div style="width: 300px;"> 
 
    <ul class="ul-two-cols"> 
 
    <li>1.</li> 
 
    <li>2.</li> 
 
    <li>3.</li> 
 
    <li>4.</li> 
 
    <li>5.</li> 
 
    <li>6.</li> 
 
    <li>7.</li> 
 
    <li>8.</li> 
 
    <li>9.</li> 
 
    <li>10.</li> 
 
    </ul> 
 
</div>