CSS இல் மார்ஜின் vs பேடிங்கை எப்போது பயன்படுத்த வேண்டும்

'கிளாஸ் கொண்ட கொள்கலன்' விளிம்பு பகுதி 'மற்றும் விண்ணப்பிக்கவும்' பாணி 'பண்பு' எல்லை:1px திட கருப்பு ”. அதன் பிறகு, '' இல் சில உரையைச் சேர்க்கவும்

'குறிச்சொல்:

< div வர்க்கம் = 'மார்ஜின்-டிவ்' பாணி = 'எல்லை:1px திட கருப்பு' >
< ப >Linuxhint சிறந்த டுடோரியல் இணையதளங்களில் ஒன்றாகும்.< br >
< / ப >
< div >

வெளியீடு

இப்போது, ​​“.margin-div” வகுப்பில் “மார்ஜின்” சொத்தை பயன்படுத்தவும்:

.margin-div {
பின்னணி - நிறம் : rgb ( 199 , 238 , 205 ) ;
எழுத்துரு- அளவு : நடுத்தர;
எல்லை : 3px rgb ( 114 , 250 , 114 ) ;
விளிம்பு: 100px 100px 100px 100px;
}

மேலே உள்ள குறியீட்டில், ' .margin-div 'கீழே பட்டியலிடப்பட்ட பண்புகளைப் பயன்படுத்துவதற்கு div உறுப்பை அணுகுவதற்குப் பயன்படுத்தப்படுகிறது:

• ' பின்னணி நிறம் பின்னணியில் வண்ணத்தைப் பயன்படுத்த சொத்து பயன்படுத்தப்படுகிறது.
• ' எழுத்துரு அளவு ” எழுத்துருவின் அளவை சரிசெய்ய பயன்படுத்தப்படுகிறது.
• ' விளிம்பு ” உறுப்புக்கு வெளியே இடத்தை ஒதுக்குகிறது. உதாரணமாக, 'விளிம்பு' சொத்தை '' என அமைத்துள்ளோம் 100px ”.

இங்கே, நாங்கள் வெற்றிகரமாக அமைத்திருப்பதைக் காணலாம் ' விளிம்பு 'இரண்டாவது சொத்து' div ”உறுப்பு:

CSS இல் 'பேடிங்கை' எவ்வாறு பயன்படுத்துவது?

'பேடிங்' சொத்தை பயன்படுத்த, மேலே கூறப்பட்ட எடுத்துக்காட்டுகள் பயன்படுத்தப்பட்டுள்ளன. இரண்டாவது ' div ' கொள்கலன், வகுப்பைப் பயன்படுத்து ' padding-div ” திணிப்பு விண்ணப்பிக்க:

< div வர்க்கம் = 'லினக்ஸ்' >
< ப > Linuxhint சிறந்த டுடோரியல் வலைத்தளங்களில் ஒன்றாகும் < / ப >
< / div >
< div வர்க்கம் = 'பேடிங்-டிவ்' பாணி = 'எல்லை:1px திட கருப்பு' >
< ப >Linuxhint சிறந்த டுடோரியல் இணையதளங்களில் ஒன்றாகும்.< br >
< / ப >
< / div >

வெளியீடு

திணிப்பு மற்றும் பிற CSS பண்புகளை ' .padding-div 'வகுப்பு, வழங்கப்பட்ட குறியீட்டைப் பாருங்கள்:

.padding-div {
பின்னணி - நிறம் : rgb ( 199 , 238 , 205 ) ;
எழுத்துரு- அளவு : நடுத்தர;
திணிப்பு: 50px 50px 50px 50px;
}

மேலே குறிப்பிடப்பட்ட குறியீட்டில், நாங்கள் இரண்டாவதாக அணுகினோம் ' div 'வகுப்பைப் பயன்படுத்தி உறுப்பு' .padding-div ”. நாங்கள் 'பின்னணி-வண்ணம்' மற்றும் 'எழுத்துரு அளவு' ஆகியவற்றை அமைத்துள்ளோம். மேலும், ' திணிப்பு 'ஒவ்வொரு பக்கத்திலிருந்தும் உறுப்பு உள்ளடக்கத்தைச் சுற்றி இடத்தைச் சேர்க்க சொத்து பயன்படுத்தப்படுகிறது' 50px ”.

வெளியீடு

CSS இல் 'பேடிங்' மற்றும் 'மார்ஜின்' ஆகியவற்றின் வேறுபாடுகள் மற்றும் பயன்பாடுகளை நாங்கள் விளக்கியுள்ளோம்.

முடிவுரை

CSS” விளிம்பு 'உறுப்பைச் சுற்றி இடைவெளியை அமைக்கப் பயன்படுத்தப்படுகிறது, அதே நேரத்தில் ' திணிப்பு ” என்பது உறுப்பு உள்ளடக்கத்தைச் சுற்றி இடைவெளியைச் சேர்க்கப் பயன்படுகிறது. மார்ஜின் அல்லது பேடிங் சொத்தை பயன்படுத்த, முதலில், '' div ” கொள்கலன், மற்றும் வகுப்பைக் குறிப்பிடவும். அதன் பிறகு, வகுப்பின் பெயரால் வகுப்பை அணுகி, ' விளிம்பு 'மற்றும்' திணிப்பு 'பண்புகள். இந்த இடுகை CSS இல் மார்ஜின் vs பேடிங்கின் பயன்பாட்டை விளக்கியுள்ளது.