2009-09-06 15 views

उत्तर

36

बजाय निम्नलिखित का प्रयास करें:

<html> 
<head> 
    <title>Table row styling</title> 
    <style type="text/css"> 
    .bb td, .bb th { 
    border-bottom: 1px solid black !important; 
    } 
    </style> 
</head> 
<body> 
    <table> 
    <tr class="bb"> 
     <td>This</td> 
     <td>should</td> 
     <td>work</td> 
    </tr> 
    </table> 
</body> 
</html> 
+0

आपके उत्तर के लिए धन्यवाद। लेकिन यह काम नहीं कर रहा है। – omg

+0

मैं सही खड़ा हूं: सीमा-तल का प्रयास करें: 1 पीएक्स ठोस काला; बजाय। –

+0

अभी भी काम नहीं कर रहा है। – omg

6

तुम इतनी तरह td तत्व की शैली को परिभाषित करना चाहिए:

<html> 
<head> 
    <style type="text/css"> 
     .bb 
     { 
      border-bottom: solid 1px black; 
     } 
    </style> 
</head> 
<body> 
    <table> 
     <tr> 
      <td> 
       Test 1 
      </td> 
     </tr> 
     <tr> 
      <td class="bb"> 
       Test 2 
      </td> 
     </tr> 
    </table> 
</body> 
</html> 
+0

क्यों tr को सीधे संशोधित नहीं कर सकता? – omg

+1

** ** धोखा ** के रूप में कहा: "आप शैली नहीं बना सकते हैं, क्योंकि यह केवल" तार्किक समूह तत्व "है, लेकिन यह वास्तव में प्रस्तुत नहीं किया जाता है। आप के अंदर केवल या तत्वों को स्टाइल कर सकते हैं। सुनिश्चित करें कि आप कुछ तो लें।" –

+3

यह एक अच्छा तरीका है। एकमात्र चीज जिसके खिलाफ मैं सावधानी बरतता हूं वह यह है कि एचटीएमएल रेंडर का आकार कक्षा में तालिका में टीडी तत्वों की संख्या के अनुपात में बढ़ेगा। यदि आकार चिंता का विषय है, तो हम तालिका तत्व को स्वयं ला ला तालिका # idForTable tr td {सीमा-तल: 1px ठोस काला} को लक्षित करके अधिक प्रभावी होंगे। पंक्तियों के पूरे सेट के लिए एक खंड। –

22

मेज पर border-collapse:collapse जोड़ें।

उदाहरण:

table.myTable{ 
    border-collapse:collapse; 
} 

table.myTable tr{ 
    border:1px solid red; 
} 

यह मेरे लिए काम किया।

+4

यह स्वीकार्य उत्तर होना चाहिए। टेबल कोशिकाओं पर सीमा डालने से यह टूट जाता है। –

+0

इससे पहले कहा गया है कि वास्तव में स्वीकार्य उत्तर होना चाहिए। आपकी तालिका में तत्व जोड़ना जो आपको लगता है वह नहीं करेगा। यही कहना है कि यदि आप अपने पृष्ठ पर अधिक HTML नहीं जोड़ना चाहते हैं और अपनी टेबल को फिर से बनाना चाहते हैं ... यह अब तक के सबसे सरल समाधान हैं जिन्हें मैंने देखा है। – greaterKing

1
tr td 
{ 
    border-bottom: 2px solid silver; 
} 

या यदि आप टी.आर. टैग के अंदर सीमा चाहते हैं, आप ऐसा कर सकते हैं:

tr td { 
    box-shadow: inset 0px -2px 0px silver; 
} 
1

क्या मैं यहाँ कहना चाहता हूँ ऐड-ऑन @Suciu लुसियान के जवाब पर किसी तरह का की तरह है।

अजीब स्थिति में मैंने भाग लिया यह है कि जब मैं अपनी फ़ाइल में @ सुसीउ लुसियान का समाधान लागू करता हूं, तो यह क्रोम में काम करता है लेकिन सफारी में नहीं (और फ़ायरफ़ॉक्स में नहीं आज़माया जाता है)।

table.myTable{ 
    border-spacing: 0; 
} 

table.myTable td{ 
    border-bottom:1px solid red; 
} 

हाँ आप tr के बजाय td शैली देने की आवश्यकता: बाद मैं guide of styling table border w3.org द्वारा प्रकाशित अध्ययन किया, मैं कुछ विकल्प मिल गया।

संबंधित मुद्दे