Cellpadding in einer Tabellenzelle html

Question

Ist es möglich, in Abhängigkeit von der gesamten HTML-Tabelle nur eine Zelle Zelle padding haben?

Answer 1

Gerade Art der Zelle mit Hilfe von CSS:

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

Answer 2

Für den Einsatz in Styling eine E-Mail ist es manchmal schwierig ist, Polsterung mit CSS zu erreichen, wenn Sie die E-Mail wollen über E-Mail-Programme, konsequent zu sein, vor allem Outlook. Wenn Sie nicht über CSS verwenden möchten, ist eine Abhilfe mit einer Zeile eine neue Tabelle zu setzen und eine Zelle in der Zelle, die Sie padding anwenden möchten. Dann gilt die Polsterung zu dieser ‚einem lige‘ Tabelle.

Im Beispiel in der Frage gegeben würde dies werden:

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

Answer 3

Leider nicht, wenn Sie mit <table cellpadding="0"> sich beziehen, wie eine Tabelle weite Einstellung ist. Wenn Sie Polsterung nur eine Zelle angewendet werden soll, müssen Sie eine Klasse hinzufügen, und es ist ein padding Wert auf diese Weise zugewiesen werden.

Answer 4

Sie können diese CSS versuchen.

Tabelle mit 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;
}

mit der Klasse ‚splcell‘ wir die einzelnen Zell Stil kann.

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