HTML அட்டவணை பேடிங் & இடைவெளி
HTML அட்டவணைகள் கலங்களுக்குள் உள்ள பேடிங்கையும், கலங்களுக்கு இடையேயான இடத்தையும் சரிசெய்யலாம்.
பேடிங்குடன்
| hello | hello | hello |
| hello | hello | hello |
| hello | hello | hello |
இடைவெளியுடன்
| hello | hello | hello |
| hello | hello | hello |
| hello | hello | hello |
HTML அட்டவணை - கல பேடிங்
கல பேடிங் என்பது கல விளிம்புகள் மற்றும் கல உள்ளடக்கத்திற்கு இடையே உள்ள இடைவெளியாகும்.
இயல்புநிலையாக பேடிங் 0 என அமைக்கப்பட்டுள்ளது.
அட்டவணை கலங்களில் பேடிங்கைச் சேர்க்க, CSS padding பண்பைப் பயன்படுத்தவும்:
எடுத்துக்காட்டு
th, td {
padding: 15px;
}உள்ளடக்கத்திற்கு மேலே மட்டும் பேடிங்கைச் சேர்க்க, padding-top பண்பைப் பயன்படுத்தவும்.
padding-bottom, padding-left, மற்றும் padding-right பண்புகளுடன் மற்ற பக்கங்களில் பேடிங்கைச் சேர்க்கவும்:
எடுத்துக்காட்டு
th, td {
padding-top: 10px;
padding-bottom: 20px;
padding-left: 30px;
padding-right: 40px;
}| தலைப்பு 1 | தலைப்பு 2 |
|---|---|
| தரவு 1 | தரவு 2 |
மேல்: 10px, கீழ்: 20px, இடது: 30px, வலது: 40px பேடிங்
HTML அட்டவணை - கல இடைவெளி
கல இடைவெளி என்பது ஒவ்வொரு கலத்திற்கும் இடையே உள்ள இடைவெளியாகும்.
இயல்புநிலையாக இடைவெளி 2 பிக்சல்களாக அமைக்கப்பட்டுள்ளது.
அட்டவணை கலங்களுக்கு இடையேயான இடத்தை மாற்ற, table உறுப்பில் CSS border-spacing பண்பைப் பயன்படுத்தவும்:
எடுத்துக்காட்டு
table {
border-spacing: 30px;
}| கலம் 1 | கலம் 2 | கலம் 3 |
| கலம் 4 | கலம் 5 | கலம் 6 |
30px border-spacing