Question

如图所示，您可以看到＆＃39; Sezon＆＃39;和＆＃39; Poza sezonem＆＃39;块在另一个块上（ND-CZW，PT-SB）

我正在尝试编写此图片的HTML代码。我怎么能把Sezon，poza sezonem块放在下面的块上？

<div class="parent">
<tr>
<td style="text-align: center;background-color: #E96165;color: #fff">Ilosc 
gosci</td>
<td class="baslik1">Sezon</td> 
<td class="baslik1">Poza sezonem</td>
<td class="baslik1">Poza sezonem 2</td>
</tr>
<tr>
<td class="baslik2"> </td>
<td class="baslik2">ND-CZW</td> 
<td class="baslik2">PT-SB</td>
<td class="baslik2">ND-CZW</td>
</tr>
</div>

Answer 1

我会像这样使用绝对定位的Flexbox：

＆＃13;

<div class="parent">
  <div class="table">
    <div class="cell cell--logo">
      Ilosc gosci
    </div>
    <div class="cell">
      Ilosc gosci
    </div>
  </div>
  <div class="table">
    <div class="cell cell--head">
      <span class="label">Sezon</span>
      <div>ND-CZW</div>
      <div>ND-CZW</div>
    </div>
    <div class="cell">
      <div>245 pln</div>
      <div>245 pln</div>
    </div>
  </div>
  <div class="table">
    <div class="cell cell--head">
      <span class="label">Poza sezonem</span>
      <div>ND-CZW</div>
      <div>ND-CZW</div>
    </div>
    <div class="cell">
      <div>245 pln</div>
      <div>245 pln</div>
    </div>
  </div>
  <div>
    <td class="baslik2"></td>
    <td class="baslik2"></td> 
    <td class="baslik2"></td>
    <td class="baslik2"></td>
  </div>
  </div>
</div>

＆＃13;

<div id="containerTop" class="container">
    <?php
    $temp = $wp_query;
    $wp_query = null;
    $wp_query = new WP_Query();
    $wp_query->query( 'showposts=5' . '&paged=' . $paged );
    while ( $wp_query->have_posts() ): $wp_query->the_post();
    ?>
    <div class="row">
        <?php
        for ( $i = 0; $i <= 2; $i++ ) {
            ?>
        <div class="col-md-4">
            <?php if ( has_post_thumbnail() ) { ?>
            <a href="<?php the_permalink(); ?>">
                <?php the_post_thumbnail('medium', array( 'class' => 'img-responsive' )); ?>
            </a>

            <?php }?>
            <?php the_excerpt();?>
        </div>
        <?php
        };
        ?>

    </div>
    <?php endwhile; ?>
</div>

＆＃13;

Answer 2

您的代码似乎有一些错误的语法，我尝试在下面的小提琴中实现相同的

http://jsfiddle.net/Parthoghsh820/akhwgg2f/3/

<table>
<thead>
    <tr class="header">
        <th colspan="2">
       <span>Major 1</span>
        </th>
        <th colspan="2">
        <span>Major 2</span>
        </th>
    </tr>
    <tr class="subheader">
        <th>col1</th>
        <th>col2</th>
        <th>col3</th>
        <th>col4</th>
    </tr>
</thead>
<tbody>
    <tr>
        <td>data1</td>
        <td>data2</td>
        <td>data3</td>
        <td>data4</td>
    </tr>
</tbody>

如何把行放到另一个？ / CSS

2 个答案: