एक एचटीएमएल टेबल सेल में सेलपैडिंग

Question

क्या पूरे एचटीएमएल टेबल बनाम सिर्फ एक सेल में सेल पैडिंग संभव है?

Answer 1

बस शैली सेल सीएसएस का उपयोग कर:

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

Answer 2

दुर्भाग्य से नहीं, यदि आप <table cellpadding="0"> का उपयोग करने का जिक्र कर रहे हैं, क्योंकि यह एक टेबल-व्यापी सेटिंग है। यदि आप केवल एक सेल पर पैडिंग लागू करना चाहते हैं, तो आपको एक कक्षा जोड़नी होगी और इसे padding वैल्यू असाइन करना होगा।

Answer 3

एक ईमेल स्टाइल में उपयोग के लिए यदि आप मेल ई-मेल कार्यक्रम, विशेष रूप से आउटलुक में संगत होना चाहते हैं सीएसएस के साथ गद्दी हासिल करने के लिए कभी कभी मुश्किल है। यदि आप सीएसएस का उपयोग नहीं करना चाहते हैं, तो एक वर्कअराउंड एक नई पंक्ति को उस सेल में एक पंक्ति और एक सेल के साथ रखना है जिसे आप पैडिंग लागू करना चाहते हैं। फिर उस 'एक सेल' टेबल पर पैडिंग लागू करें।

प्रश्न में दिए गए उदाहरण में यह बन गयी:

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

Answer 4

आप इस सीएसएस कोशिश कर सकते हैं।

तालिका का उपयोग कर div

एचटीएमएल

<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> 

सीएसएस

.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; 
} 

वर्ग का उपयोग कर 'splcell' हम अलग-अलग सेल शैली दे सकते हैं।

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