टेबल में विभिन्न पंक्तियों में विभिन्न टीडी चौड़ाई?

Question

त्वरित प्रश्न: यह कैसे प्राप्त किया जा सकता है? (नीचे छवि देखें)

सादे html में td चौड़ाई बूथ स्थापना और कोई प्रभाव नहीं पड़ा सीएसएस के साथ।

td चौड़ाई भिन्न हो सकती है लेकिन प्रत्येक पंक्ति के लिए केवल एक ही चौड़ाई के साथ बदल सकती है।

Answer 1

तीन अलग <table> ब्लॉक का उपयोग करें, प्रत्येक एक पंक्ति के साथ अलग-अलग चौड़ाई के तीन कॉलम होते हैं।

Answer 2

मुझे विश्वास नहीं है कि यह आसानी से एक टेबल में हो सकता है।

इसके बजाय, आपको अलग-अलग पंक्तियों पर कोशिकाओं को ओवरलैप करने के लिए colspan विशेषता का उपयोग करना होगा।

उदाहरण के लिए, 6 स्तंभों का उपयोग, पहली पंक्ति कॉल्सपन = 2, टीडी colspan = 2

दूसरी पंक्ति टीडी, टीडी colspan = 2, टीडी और इतने पर ही होगी।

यह काफी गंदा है - आप DIVs

Answer 3

3 टीआर साथ 1 मुख्य तालिका लेने का उपयोग कर, उदाहरण के लिए, एक अलग तरीके से अपने डेटा को प्रदर्शित करने पर विचार कर सकते हैं और प्रत्येक में लागू की तुलना में 3 स्तंभ के साथ एक और उप तालिका ले टीआर सीएसएस

Answer 4

यह एक बहुत को देखने के लिए है, लेकिन आप तीन पंक्तियों जहां प्रत्येक पंक्ति तीन स्तंभों के साथ एक और तालिका में शामिल है के साथ एक माता पिता की मेज की जरूरत है:

<table> 
    <tr> 
     <td> 
      <table> 
       <tr> 
        <!-- Set Width of Individual Cells Here --> 
        <td> 
        </td> 
        <td> 
        </td> 
        <td> 
        </td> 
       </tr> 
      </table> 
     </td> 
    </tr> 
    <tr> 
     <td> 
      <table> 
       <tr> 
        <!-- Set Width of Individual Cells Here --> 
        <td> 
        </td> 
        <td> 
        </td> 
        <td> 
        </td> 
       </tr> 
      </table> 
     </td> 
    </tr> 
    <tr> 
     <td> 
      <table> 
       <tr> 
        <!-- Set Width of Individual Cells Here --> 
        <td> 
        </td> 
        <td> 
        </td> 
        <td> 
        </td> 
       </tr> 
      </table> 
     </td> 
    </tr> 
</table> 

यहाँ a working jsFiddle to illustrate है।

Answer 5

यह उप-टैबलिंग के बिना वास्तव में संभव है। मैं इसे अपने लेआउट में एक बग के रूप में कर रहा हूँ। बस

paddings और कोशिकाओं :(

"बग" लगातार कई ब्राउज़रों में काम करता है अंदर मार्जिन के साथ प्रयोग करना कोशिश संपादित करें:। शिकार किया है कि एक

td { display: block; } 

यह घर पर मत करो।