CELLPADDING nella cella di una tabella uno html
-
18-09-2019 - |
Domanda
E 'possibile avere imbottitura cella in un solo cellulare contro l'intera tabella HTML?
Soluzione
Proprio lo stile della cella usando i CSS:
<table border='1'>
<tr>
<td style="padding: 50px;">cell1</td>
</tr>
<tr>
<td>cell2</td>
</tr>
</table>
Altri suggerimenti
Per l'uso in styling una e-mail a volte è difficile da raggiungere con i CSS padding se si desidera che la posta sia coerente in tutti i programmi di posta elettronica, in particolare Outlook. Se non si desidera utilizzare i CSS, una soluzione alternativa è quella di mettere una nuova tabella con una riga e una cella nella cella che si desidera applicare imbottitura per. Quindi applicare l'imbottitura a quel tavolo 'uno unicellulari'.
Nell'esempio riportato nella domanda a questo sarebbe diventato:
<table border='1'>
<tr>
<td>
<table cellpadding="50">
<tr>
<td>cell1</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>cell2</td>
</tr>
</table>
Purtroppo, se ti riferisci a utilizzare <table cellpadding="0">
, come quello è un'impostazione a livello di tabella. Se si desidera imbottiture da applicare a un solo cellulare, dovrete aggiungere una classe e di assegnarle un valore padding
in quel modo.
Si può provare questo css.
Tabella usando 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;
}
utilizzando la classe 'splcell' siamo in grado di stile della singola cella.
.splcell{
background:red;
color:#fff;
font-weight:bold;
text-align:center;
}