2016-08-29 6 views
-2

Layout Wie würden Sie die folgende Panel-LayoutWie tabellarischer Form in HTML

  1. div/umspannt
  2. Tabelle
  3. einige Gitter
  4. ?

enter image description here

+1

Für mich, wenn mein Kunde nicht die alten IE unterstützen müssen. Ich werde flexbox verwenden, weil es dynamisch und einfach zu bedienen ist. : D –

+0

Ich würde entweder Bootstrap oder Foundation verwenden, sie haben viele verschiedene Spaltenklassen, die Sie verwenden können. – RasmusGlenvig

Antwort

1

Bootstrap (leicht zu reaktionsGitterSystem zu verwenden,) oder mit einer Tabelle (einfacheren Lösung). Es hängt von Ihren Anforderungen ab.

die Bootstrap Gitterstruktur in Ihrem Fall wäre dies:

<div class="container-fluid"> 
    <div class="row"> 
     <div class="col-md-2"> 
     </div> 
     <div class="col-md-10"> 
     </div> 
    </div> 
    <div class="row"> 
     <div class="col-md-2"> 
     </div> 
     <div class="col-md-4"> 
     </div> 
     <div class="col-md-2"> 
     </div> 
     <div class="col-md-4"> 
     </div> 
    </div> 
    <div class="row"> 
     <div class="col-md-2"> 
     </div> 
     <div class="col-md-4"> 
     </div> 
     <div class="col-md-2"> 
     </div> 
     <div class="col-md-4"> 
     </div> 
    </div> 
    <div class="row"> 
     <div class="col-md-2"> 
     </div> 
     <div class="col-md-4"> 
     </div> 
     <div class="col-md-2"> 
     </div> 
     <div class="col-md-4"> 
     </div> 
    </div> 
    <div class="row"> 
     <div class="col-md-6"> 
     </div> 
     <div class="col-md-3"> 
     </div> 
     <div class="col-md-3"> 
     </div> 
    </div> 
</div> 
+0

Während dieser Link die Frage beantworten kann, ist es besser, die wesentlichen Teile der Antwort hier aufzunehmen und den Link als Referenz zur Verfügung zu stellen. Nur-Link-Antworten können ungültig werden, wenn sich die verknüpfte Seite ändert. - [Aus Bewertung] (/ review/low-quality-posts/13495717) – worldofjr

+0

@worldofjr - Gerade meine Antwort bearbeitet, vielen Dank für den Hinweis! – matthiasunt

Verwandte Themen