2017-01-12 4 views
-3

こんにちは私は現在、私が代わりに一つずつ、私はCSSのおかげ:)excute方法ルーピング

かでwhileループ方式をexcuteことができる方法を宣言するテーブルの上に画像を表示するプロジェクトを働いていますどのように私のデータベースにアクセスしてループをexcute。

私のコード:

</style> 
<form> 
    <table class="tbl-equipments"> 
    <tbody> 
     <tr> 
     <td colspan='4' class='td-search'> 
      <input type="text" placeholder="Search Equipment.." required/> 
      <input type="button" value="Reserve" /> 
      <input type="button" value="Cancel" /> 

     </td> 
     </tr> 
     <tr> 
     <td> 
      <div style="margin: 0 auto; width: 250px height: 250px"> 
      <img src="laptop_icon.jpg" alt="Laptop" style="width: 150px" /> 
      </div> 
     </td> 
     <td> 
      <div style="margin: 0 auto; width: 250px height: 250px"> 
      <img src="laptop_icon.jpg" alt="Laptop" style="width: 150px" /> 
      </div> 
     </td> 
     <td> 
      <div style="margin: 0 auto; width: 250px height: 250px"> 
      <img src="laptop_icon.jpg" alt="Laptop" style="width: 150px" /> 
      </div> 
     </td> 
     <td> 
      <div style="margin: 0 auto; width: 250px height: 250px"> 
      <img src="laptop_icon.jpg" alt="Laptop" style="width: 150px" /> 
      </div> 
     </td> 
     </tr> 
     <tr> 
     <td> 
      <div style="margin: 0 auto; width: 250px height: 250px"> 
      <img src="laptop_icon.jpg" alt="Laptop" style="width: 150px" /> 
      </div> 
     </td> 
     <td> 
      <div style="margin: 0 auto; width: 250px height: 250px"> 
      <img src="laptop_icon.jpg" alt="Laptop" style="width: 150px" /> 
      </div> 
     </td> 
     <td> 
      <div style="margin: 0 auto; width: 250px height: 250px"> 
      <img src="laptop_icon.jpg" alt="Laptop" style="width: 150px" /> 
      </div> 
     </td> 
     <td> 
      <div style="margin: 0 auto; width: 250px height: 250px"> 
      <img src="laptop_icon.jpg" alt="Laptop" style="width: 150px" /> 
      </div> 
     </td> 
     </tr> 
    </tbody> 
    </table> 
+0

CSSをループを持たない... –

+0

CSSはあなたが探しているものではありません。各リスト項目のlaptop_icon.jpgを変更したいと思っています。これを行うには、サーバー側のプログラミングが必要です。 PHP、Rubyなどをご覧ください。 –

+0

@BarbaraLaird JSのようなクライアント側の言語です。私はこの問題がサーバー側のプログラミングを必要とするとは思わない。 – Carcigenicate

答えて

0

使用CSS

background-repeat: repeat; 

は、垂直方向にのみ繰り返してbackground-repeat: repeat-x を使用し、水平方向にのみ繰り返しbackground-repeat: repeat-y

ソースを使用するプロパティ:here