2015-07-29 2 views
2

В настоящее время я работаю над таблицей с бутстрапом, и я хочу скрыть или удалить ячейку в этой таблице.Boostrap удалить только ячейку

экран: http://perche.jeremy.free.fr/tab.png (я выкладываю ссылку, потому что я не могу отправить изображение ^^) Поэтому я хочу, чтобы скрыть или удалить ячейку красного цвета, я увидел ни решение ...

Edit:

    <div class="widget stacked widget-table action-table"> 
        <div class="widget-content"> 
         <table class="table table-striped table-bordered"> 
        <thead> 
         <tr> 
          <th></th> 
          <th>Avant</th> 
          <th>Aujourd'hui</th> 
         </tr> 
        </thead> 
        <tbody> 
         <tr> 
          <td colspan="3" class="text-center" style="background-color:#C0C0C0;"><strong>Catégorie 1</strong></td> 
         </tr> 
         <tr> 
          <td>Check1</td> 
          <td>20</td> 
          <td>40</td> 
         </tr> 
         <tr> 
          <td>Check1</td> 
          <td>20</td> 
          <td>40</td> 
         </tr> 
         <tr> 
          <td colspan="3" class="text-center" style="background-color:#C0C0C0;"><strong>Catégorie 2</strong></td> 
         </tr> 
         <tr> 
          <td>Check2</td> 
          <td>Oui</td> 
          <td>Oui</td> 
         </tr> 
         <tr> 
          <td>Check2</td> 
          <td>Oui</td> 
          <td>Non</td> 
         </tr> 
        </tbody> 
         </table> 
        </div> 
       </div> 
+0

Это статический ''

? Если это так, вам просто нужно добавить ** пустой ** '' перед «* avant *» '
'. В противном случае вы могли бы предоставить JsFiddle, чтобы помочь нам помочь вам? –

+0

Код, добавленный в edit;) – PokeRwOw

+0

Извините, я неправильно понял ваш вопрос, разместив ответ сейчас. –

ответ

0

Одним из решений было бы шкурой этой дополнительной <th></th> с для Exemple

table thead tr th:first-child { 
    background: none; 
} 

или

/* Better if there is content in it, or if there is no background defined at start */ 

table thead tr th:first-child { 
    opacity: 0; 
} 

Существует несколько CSS способов сделать это, но это, как я хотел бы сделать. Надеюсь, у вас есть идея.

Как у вас уже есть некоторые inline CSS и если вы не знаете, как справиться с этой CSS, вы также можете сделать это с inline CSS образом, даже это явно меньше чистый, чем другими способами.

<thead> 
    <tr> 
    <th style="opacity: 0;"></th> 
    <th>Avant</th> 
    <th>Aujourd'hui</th> 
    </tr> 
</thead> 

JsFiddle:

background: none; решение: http://jsfiddle.net/5omkdhnu/1/

opacity: 0; решение: http://jsfiddle.net/5omkdhnu/2/

+0

Нет, это не то, что я ищу. Я не хочу colspan 2-й, я хочу получить результат следующим образом: http://perche.jeremy.free.fr/tab2.png (зеленый фон моего тела) – PokeRwOw

+0

Вот почему я попросил скрипку. :) Я редактирую свой ответ так. –

+0

@PokeRwOw Посмотрите сейчас. На самом деле не общий код для * copy/pasta * здесь, а больше * идея * того, как я буду делать. Я еще не знаю, что у вас уровень в 'CSS', я надеюсь, вы получили смысл ** адаптировать ** это решение к вашему делу. –

Смежные вопросы