Bir html tablo hücresindeki hücre kaplaması

Question

Tüm html tablosuna karşı yalnızca bir hücrede hücre dolgulama yapmak mümkün mü?

Answer 1

Hemen tarzı CSS kullanarak hücre: Eğer posta e-posta programları, özellikle Outlook tutarlı olmasını istiyorsanız css ile dolgu elde etmek bazen zor bir e-stil kullanım için

<table border='1'> 
    <tr> 
    <td style="padding: 50px;">cell1</td> 
    </tr> 
    <tr> 
    <td>cell2</td> 
    </tr> 
</table> 

Answer 2

Maalesef, <table cellpadding="0">'u kullanmaya yönlendiriyorsanız, bu tablodaki bir ayardır. Tek bir hücreye uygulanacak dolgu yapmak isterseniz, bir sınıf eklemeniz ve bu şekilde padding değerini atamanız gerekir.

Answer 3

. CSS kullanmak istemiyorsanız, geçici bir çözüm, dolgu eklemek istediğiniz hücreye bir satır ve bir hücre ile yepyeni bir tablo koymaktır. Sonra dolguyu 'tek hücreli' tabloya uygulayın.

söz verilen örnekte bu olacaktı:

<table border='1'> 
<tr> 
    <td> 
    <table cellpadding="50"> 
    <tr> 
    <td>cell1</td> 
    </tr> 
    </table> 
    </td> 
</tr> 
<tr> 
    <td>cell2</td> 
</tr> 
</table> 

Answer 4

Bu css deneyebilirsiniz.

Tablo kullanarak div

HTML

<div class="divTable"> 
    <div class="divTableBody"> 
     <div class="divTableRow"> 
      <div class="divTableCell">1</div> 
      <div class="divTableCell splcell">2</div> 
      <div class="divTableCell">3</div> 
     </div> 
     <div class="divTableRow"> 
      <div class="divTableCell">4;</div> 
      <div class="divTableCell">5</div> 
      <div class="divTableCell">6;</div> 
     </div> 
    </div> 
</div> 

CSS

.divTable{ 
    display: table; 
    width: 100%; 
} 
.divTableRow { 
    display: table-row; 
} 
.divTableHeading { 
    background-color: #EEE; 
    display: table-header-group; 
} 
.divTableCell, .divTableHead { 
    border: 1px solid #999999; 
    display: table-cell; 
    padding: 3px 10px; 
} 
.divTableHeading { 
    background-color: #EEE; 
    display: table-header-group; 
    font-weight: bold; 
} 
.divTableFoot { 
    background-color: #EEE; 
    display: table-footer-group; 
    font-weight: bold; 
} 
.divTableBody { 
    display: table-row-group; 
} 
.splcell{ 
    background:red; 
    color:#fff; 
    font-weight:bold; 
    text-align:center; 
    padding: 5px; 
} 

sınıfını kullanarak 'splcell' biz tek bir hücre stil özelliklerini ayarlayabilirsiniz.

.splcell{ 
     background:red; 
     color:#fff; 
     font-weight:bold; 
     text-align:center; 
    }