Jassif Team Institution

HTML அட்டவணை எல்லைகள்

HTML அட்டவணைகள் வெவ்வேறு பாணிகள் மற்றும் வடிவங்களின் எல்லைகளைக் கொண்டிருக்கலாம்.

எல்லையை எவ்வாறு சேர்க்கலாம்

எல்லையைச் சேர்க்க, table, th, மற்றும் td உறுப்புகளில் CSS border பண்பைப் பயன்படுத்தவும்:

table, th, td {
  border: 1px solid black;
}

மடிந்த அட்டவணை எல்லைகள்

மேலே உள்ள எடுத்துக்காட்டில் உள்ளதைப் போல இரட்டை எல்லைகளைத் தவிர்க்க, CSS border-collapse பண்பை collapse என அமைக்கவும்.

இது எல்லைகளை ஒரு ஒற்றை எல்லையாக மடியச் செய்யும்:

table, th, td {
  border: 1px solid black;
  border-collapse: collapse;
}

அட்டவணை எல்லைகளை பாணியமைத்தல்

ஒவ்வொரு கலத்தின் பின்புல நிறத்தை அமைத்து, எல்லைக்கு வெள்ளை நிறத்தைக் கொடுத்தால் (ஆவண பின்புலத்தைப் போலவே), கண்ணுக்குத் தெரியாத எல்லையின் உணர்வைப் பெறுவீர்கள்:

table, th, td {
  border: 1px solid white;
  border-collapse: collapse;
}
th, td {
  background-color: #96D4D4;
}

வட்ட அட்டவணை எல்லைகள்

border-radius பண்புடன், எல்லைகள் வட்டமான மூலைகளைப் பெறுகின்றன:

table, th, td {
  border: 1px solid black;
  border-radius: 10px;
}

CSS தேர்வியில் table ஐ விட்டுவிடுவதன் மூலம் அட்டவணையைச் சுற்றியுள்ள எல்லையைத் தவிர்க்கவும்:

th, td {
  border: 1px solid black;
  border-radius: 10px;
}

புள்ளி அட்டவணை எல்லைகள்

border-style பண்புடன், நீங்கள் எல்லையின் தோற்றத்தை அமைக்கலாம்.

பின்வரும் மதிப்புகள் அனுமதிக்கப்படுகின்றன:

• dotted
• dashed
• solid
• double
• groove
• ridge
• inset
• outset
• none
• hidden

th, td {
  border-style: dotted;
}

எல்லை நிறம்

border-color பண்புடன், நீங்கள் எல்லையின் நிறத்தை அமைக்கலாம்.

th, td {
  border-color: #96D4D4;
}

பயிற்சி