HTML तालिका सीमाएँ
HTML तालिकाओं में विभिन्न शैलियों और प्रारूपों की सीमाएँ हो सकती हैं।
बॉर्डर कैसे जोड़ें
बॉर्डर जोड़ने के लिए, टेबल, वें और टीडी तत्वों पर सीएसएस बॉर्डर विशेषता का उपयोग करें:
| शीर्षक 1 | शीर्षक 2 |
|---|---|
| डेटा 1 | डेटा 2 |
उदाहरण
table, th, td {
border: 1px solid black;
}मुड़ी हुई मेज की सीमाएँ
उपरोक्त उदाहरण के अनुसार दोहरी सीमाओं से बचने के लिए, CSS border-collapse प्रॉपर्टी को संक्षिप्त करने के लिए सेट करें।
यह सीमाओं को एक ही सीमा में संक्षिप्त कर देगा:
| शीर्षक 1 | शीर्षक 2 |
|---|---|
| डेटा 1 | डेटा 2 |
उदाहरण
table, th, td {
border: 1px solid black;
border-collapse: collapse;
}स्टाइलिंग टेबल बॉर्डर
यदि आप प्रत्येक सेल के लिए पृष्ठभूमि का रंग सेट करते हैं और बॉर्डर को सफ़ेद रंग देते हैं (बिल्कुल दस्तावेज़ पृष्ठभूमि फ़ील्ड की तरह), तो आपको एक अदृश्य बॉर्डर का आभास होगा:
| शीर्षक 1 | शीर्षक 2 |
|---|---|
| डेटा 1 | डेटा 2 |
उदाहरण
table, th, td {
border: 1px solid white;
border-collapse: collapse;
}
th, td {
background-color: #96D4D4;
}वृत्ताकार तालिका सीमाएँ
सीमा-त्रिज्या संपत्ति के साथ, सीमाओं को गोल कोने मिलते हैं:
| शीर्षक 1 | शीर्षक 2 |
|---|---|
| डेटा 1 | डेटा 2 |
उदाहरण
table, th, td {
border: 1px solid black;
border-radius: 10px;
}CSS चयनकर्ता में तालिका छोड़कर तालिका के चारों ओर बॉर्डर से बचें:
उदाहरण
th, td {
border: 1px solid black;
border-radius: 10px;
}प्वाइंट टेबल की सीमाएं
बॉर्डर-शैली विशेषता के साथ, आप बॉर्डर का स्वरूप निर्धारित कर सकते हैं।
| शीर्षक 1 | शीर्षक 2 |
|---|---|
| डेटा 1 | डेटा 2 |
निम्नलिखित मानों की अनुमति है:
- dotted
- dashed
- solid
- double
- groove
- ridge
- inset
- outset
- none
- hidden
उदाहरण
th, td {
border-style: dotted;
}सीमा रंग
बॉर्डर-रंग विशेषता के साथ, आप बॉर्डर का रंग सेट कर सकते हैं।
| शीर्षक 1 | शीर्षक 2 |
|---|---|
| डेटा 1 | डेटा 2 |
उदाहरण
th, td {
border-color: #96D4D4;
}