क्यों एचटीएमएल टेबल सेल का सीमा रंग बदलता नहीं है?

मैं सेल लाल की बाएं सीमा कैसे बना सकता हूं? यह क्यों काम नहीं करता है? धन्यवाद!!क्यों एचटीएमएल टेबल सेल का सीमा रंग बदलता नहीं है?

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<style type="text/css"> 
.main-table { 
    border-collapse: collapse; 
} 
.main-table td { 
    margin: 0px; 
    padding: 0px; 
    border: 1px solid #aaa; 
    padding: 1px 4px 1px 4px; 
} 
.left-border { 
border-left: 1px solid red !important; 
} 
</style> 
</head> 
<link rel="stylesheet" type="text/css" href="style.css" /> 
</head> 
<body>

बाएं सीमा को .main-table td पर निर्दिष्ट रंग को ओवरराइड नहीं करना चाहिए?

<table class='main-table' cellspacing='0' cellpadding='0'> 
<tr> 
    <td> 1 </td> 
    <td> 366 </td> 
</tr> 
<tr> 
    <td > 2 </td> 
    <td class='left-border'> 777 </td> 
</tr> 
</table> 

</body> 
</html>

स्रोत

2012-01-18 vrepsys

सीमा को 1px double red पर सेट करें। एक 1 पीएक्स-चौड़ा "डबल" सीमा एक "ठोस" के समान दिखती है, लेकिन गिरने वाली सीमा गणना में उच्च प्राथमिकता है।

स्रोत

2012-01-18 07:06:51

संदर्भ के लिए, सीएसएस 2.1 में सीमा संघर्ष समाधान के नियम हैं [यहां] (http://www.w3.org/TR/CSS2/tables.html#border-conflict-resolution)। –

यह काम करता है। बढ़िया, लिंक के लिए धन्यवाद! – vrepsys

यदि आप स्टैक ओवरफ्लो पर किसी उत्तर से संतुष्ट हैं, तो कृपया वोट स्कोर के तहत चेक मार्क को चिपकाकर इसे स्वीकार करें। –

इस प्रयास करें,

.main-table { 
    border-collapse: collapse; 
} 
.left-border { 
border-left: 2px solid red !important; 
}

स्रोत

2012-01-18 07:03:23 anglimasS

प्रश्न पूछता नहीं है। –

यह काम नहीं कर रहा है ... –

@ श्री टी.के. - अब नैनबा की जांच करें ... – anglimasS

-1

collapse मूल्य का मतलब सीमाओं एक भी सीमा में जब ढह रहे हैं संभव। border-collapse संपत्ति के लिए आप separate का उपयोग करना चाहते हैं।

इसके अलावा, आपके पास दो बंद </head> टैग हैं।

स्रोत

2012-01-18 07:04:38 styfle

प्रश्न नहीं पूछता है कि क्या करता है। –

@ कोलिंक: हम उस व्यक्ति को क्यों नहीं देते जिसने प्रश्न पूछा है? – styfle

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

एक और समाधान,

http://jsfiddle.net/yPSVg/

स्रोत

2012-01-18 07:09:22

सीएसएस में चयनकर्ता कि सबसे विशिष्ट होता है कम विशिष्ट लोगों पर पूर्वता लेता है। उदाहरण के लिए, आपके मामले में .main-table td.left-border से अधिक प्राथमिकता लेता है क्योंकि पूर्व अधिक विशिष्ट है। इसे हल करने के लिए, आप सीमा ओवरराइड के लिए निर्दिष्ट कर सकते हैं: .main-table td.left-border। !important का उपयोग करने से यह अधिक सही और बेहतर है जो इसे आगे ओवरराइड करने की सभी संभावनाओं को समाप्त करता है।

CSS चयनकर्ता पूर्वता पर जानकारी के लिए इस लिंक देखें: http://www.vanseodesign.com/css/css-specificity-inheritance-cascaade/

स्रोत

2012-01-18 07:09:30 techfoobar

'! महत्वपूर्ण' इस मुद्दे को रोकता है, हालांकि मैं यह कहता हूं कि 'महत्वपूर्ण' –

मैं anglimass के साथ जाना होगा, लेकिन सीएसएस के लिए एक परिवर्तन के साथ:

td.left-border { 
border-left: 1px double red !important; 
}

है, चयनकर्ता अतिरिक्त "होना चाहिए टीडी "

(संपादित 2px सीमा 1px करने के लिए - कि एक गलती थी!)

स्रोत

2012-01-18 07:19:54 BilalKat

पर भरोसा करने से विशिष्टता का उपयोग करना बेहतर है, यह मदद करने के लिए दोगुनी हो रही है। सीमा चौड़ाई को 2px पर सेट करने से ठोस होने पर रंग भी बदल जाता है। हालांकि, मुझे जो चाहिए वह 1 पीएक्स सीमा थी। फिर भी धन्यवाद – vrepsys

हममम। ऐसा लगता है कि इस तरह से उस क्रम पर निर्भर करता है जिसमें सेल सीमाएं ब्राउज़र द्वारा खींची जाती हैं। मैंने उपरोक्त आईई 8 में कोशिश की और यह ठीक लग रहा था, लेकिन एफएफ या क्रोम में काम नहीं किया।

फिर मैंने सटीक उसी मार्कअप का उपयोग करके बाएं सेल लाल की दायां सीमा बनाने की कोशिश की। इस बार यह आईई में काम नहीं किया लेकिन एफएफ और क्रोम में काम किया।

यदि आप सही सेल लाल की बाएं सीमा और बाएं सेल लाल की दाएं सीमा दोनों बनाते हैं, तो यह उन सभी में काम करता है।

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<style type="text/css"> 
.main-table 
{ 
    border-collapse: collapse; 
} 
.main-table td 
{ 
    margin: 0px; 
    padding: 0px; 
    border: 1px solid #aaa; 
    padding: 1px 4px 1px 4px; 
} 
.right-border 
{ 
    border-right: 1px solid red !important; 
} 
.left-border 
{ 
    border-left: 1px solid red !important; 
} 
</style> 
<link rel="stylesheet" type="text/css" href="style.css" /> 
</head> 
<body> 
    <table class='main-table' cellspacing='0' cellpadding='0'> 
     <tr> 
      <td> 1 </td> 
      <td> 366 </td> 
     </tr> 
     <tr> 
      <td class='right-border'> 2 </td> 
      <td class='left-border'> 777 </td> 
     </tr> 
    </table> 
</body> 
</html>

स्रोत

2012-01-18 07:35:28

क्यों एचटीएमएल टेबल सेल का सीमा रंग बदलता नहीं है?

उत्तर

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