2010-05-07 25 views
9

दोनों सीमा क्यों नहीं दिख रही हैं?क्यों <th> और <thead> दोनों की सीमा क्यों नहीं दिख रही है?

http://jsfiddle.net/r8mA7/

<table> 
<thead style="border-top:10px solid red; background:yellow"> 
    <tr><th style="border-top:10px solid green">Name</th></tr> 
</thead> 
<tbody> 
    <tr><td>Bob</td></tr> 
    <tr><td>Tom</td></tr> 
</tbody> 
</table> 
+0

आपका क्या मतलब है? – SLaks

+0

कुछ एचटीएमएल और सीएसएस मदद करेंगे, शायद आपके पास एक कैस्केड मुद्दा है। – Kyle

+0

उम, यह फ़ायरफ़ॉक्स में ठीक दिखता है। आप कौन सा ब्राउज़र उपयोग कर रहे हैं? http://i42.tinypic.com/2ahrvhz.png – MiffTheFox

उत्तर

12

के बीच एक ही स्टाइल विशेषता संघर्ष हो, तो यह अधिक प्राथमिकता हो सकती है। यह अपेक्षित व्यवहार है। अजीब, लेकिन उम्मीद है।
सीमाएं गिर रही हैं, और मोटा एक प्रचलित है।

आप इसे इस उदाहरण के साथ देख सकते हैं: पहली पंक्ति पतन पर छूने वाली सीमाएं, दूसरी पंक्ति पर वाले लोग नहीं करते हैं।
पहली पंक्ति पर पहले सेल को मोटी सीमा (10 पीएक्स हरा> 5 पीएक्स लाल) मिलती है, और दूसरा सेल मोटा सीमा (5 पीएक्स लाल> 3 पीएक्स हरा) प्राप्त करता है।
दूसरी पंक्ति पर पतन के लिए "आसन्न" सीमाएं नहीं हैं, इसलिए 10 पीएक्स हरे और 3 पीएक्स हरे रंग की सीमाएं सामान्य रूप से दिखाई देती हैं।

<table> 
<thead style="border-top:5px solid red; background:yellow"> 
    <tr> 
    <th style="border-top:10px solid green">Name</th> 
    <th style="border-top:3px solid green">Name</th> 
    </tr> 
    <tr> 
    <th style="border-top:10px solid green">Name</th> 
    <th style="border-top:3px solid green">Name</th> 
    </tr> 
</thead> 
</table> 

मुझे किसी भी तरह स्पष्टीकरण को साफ़ करने की आवश्यकता है?

पीएस: सैद्धांतिक रूप से आप इसे रोकने के लिए तालिका पर border-collapse संपत्ति का उपयोग कर सकते हैं, लेकिन मैं प्रबंधन नहीं कर रहा हूं।
इसके अलावा, डिफ़ॉल्ट मान गिरने के लिए प्रतीत नहीं होता है।

आगे पढ़ने: http://www.w3.org/TR/CSS2/tables.html#borders

2

आप इस तरह चयनकर्ता के रूप में <thead> तत्व का उपयोग कर सकते हैं:

thead { background: red; } 

You can see an example here

+1

दोनों दिखाना चाहता हूं, मैं 'thead {border-top: 10px solid red} 'दे रहा हूं लेकिन –

+0

पर काम नहीं कर रहा हूं, ठीक है, यह देखने के लिए क्यों नहीं हरे रंग की सीमा http://jsfiddle.net/r8mA7/ –

+0

@metal - यहां एक अद्यतन उदाहरण दिया गया है: http://jsfiddle.net/uwQFW/2/ –

-4

अपनी तालिका में एक वर्ग के नाम दें। और नीचे

<style> 
.mytable thead{ 
//your style goes here 
} 


</style> 

संपादित के रूप में यह शैली:

<table> 
<thead style="border-top:10px solid red; background:yellow"> 
    <tr><th style="border-left:10px solid green">Name</th></tr> 
</thead> 
<tbody> 
    <tr><td>Bob</td></tr> 
    <tr><td>Tom</td></tr> 
</tbody> 
</table> 

इस कोड का प्रयास करें। थैड और वें की सीमा दिखायी जा रही है। हो सकता है कि वें और थैड

+2

पोस्टर का सवाल नहीं। – marr75

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