திணிப்பு என்பது மிக முக்கியமான அம்சங்களில் ஒன்றாகும் மற்றும் . இந்த கட்டுரையில் CSS இல் பேடிங்கின் முக்கியத்துவம் மற்றும் பயன்பாடு குறித்து பின்வரும் வரிசையில் விவாதிப்போம்:
CSS இல் திணிப்பு என்றால் என்ன?
திணிப்பு சொத்து ஒரு உறுப்பின் உள்ளடக்க உரைக்கும் அதன் எல்லைக்கும் இடையில் எங்கு குறிப்பிட வேண்டும் மற்றும் எவ்வளவு இடம் தோன்ற வேண்டும் என்பதை அனுமதிக்கிறது. இந்த பண்புக்கூறு மதிப்பு ஒரு நீளம் அல்லது சதவீதம் அல்லது வார்த்தையாக இருக்க வேண்டும்.
மதிப்பு மரபுரிமையாக இருந்தால், அது பெற்றோரின் அதே திணிப்பாக இருக்கும். இங்கே சதவீதம் பயன்படுத்தப்பட்டால், சதவீதம் கொண்ட பெட்டியின் சதவீதம்.
திணிப்பு பண்புகள்
CSS இல் உள்ள திணிப்பின் பின்வரும் பண்புகள் பட்டியல்களைக் கட்டுப்படுத்தப் பயன்படுத்தப்படலாம். இருப்பினும், முக்கியமாக பின்வரும் பண்புகளைப் பயன்படுத்தி பெட்டியின் இருபுறமும் திணிப்புக்கு வெவ்வேறு மதிப்புகளை அமைக்கலாம்:
திணிப்பு-கீழ்: இது ஒரு தனிமத்தின் கீழ் திணிப்பைக் குறிப்பிடுகிறது.
திணிப்பு-மேல்: இது ஒரு தனிமத்தின் மேல் திணிப்பைக் குறிப்பிடுகிறது.
திணிப்பு-இடது: இது தனிமத்தின் இடது திணிப்பைக் குறிப்பிடுகிறது.
திணிப்பு-வலது: இது தனிமத்தின் சரியான திணிப்பைக் குறிப்பிடுகிறது.
திணிப்பு: இது மேலும் பண்புகளுக்கான சுருக்கெழுத்து ஆகும்.
திணிப்பு-கீழ் சொத்து:
இது ஒரு தனிமத்தின் கீழ் திணிப்புக்கு அமைக்கப்பட்டுள்ளது. இது சதவீதத்தின் மதிப்பில் மதிப்புகளை எடுக்கலாம்.
இது கீழே குறிப்பிடப்பட்ட பத்தி
இது சதவீதத்தில் குறிப்பிடப்பட்ட கீழ் திணிப்பு மற்றொரு பத்தி வெளியீடு:
திணிப்பு-மேல் சொத்து
இந்த திணிப்பு-மேல் சொத்து ஒரு உறுப்பின் மேல் திணிப்பை அமைக்கும். இது சதவீதத்தின் நீளத்தில் மதிப்புகளை எடுக்கலாம்.
இது பத்தி குறிப்பிடப்பட்ட மேல் திணிப்பு ஆகும்
இது சதவீதத்தில் குறிப்பிடப்பட்ட மேல் திணிப்பு மற்றொரு பத்தி கசாண்ட்ரா அட்டவணை vs நெடுவரிசை குடும்பம்
வெளியீடு:
திணிப்பு-இடது சொத்து
இந்த திணிப்பு-இடது சொத்து ஒரு உறுப்பின் இடது திணிப்பை அமைக்கும். இது சதவீதத்தின் நீளத்தில் மதிப்புகளை எடுக்கலாம்.
இது குறிப்பிடப்பட்ட இடது திணிப்பு பத்தி
இது சதவீதத்தில் குறிப்பிடப்பட்ட இடது திணிப்பு மற்றொரு பத்தி வெளியீடு:
திணிப்பு-வலது சொத்து
இந்த திணிப்பு-வலது சொத்து ஒரு தனிமத்தின் சரியான திணிப்பை அமைக்கும். இது சதவீதத்தின் நீளத்தில் மதிப்புகளை எடுக்கலாம்.
இது சரியான திணிப்பு குறிப்பிடப்பட்ட பத்தி
இது சரியான திணிப்பு சதவீதத்தில் குறிப்பிடப்பட்ட மற்றொரு பத்தி வெளியீடு:
திணிப்பு சொத்து
இந்த திணிப்பு சொத்து வலது, இடது, மேல் மற்றும் கீழ் திணிப்பை அமைக்கிறது. இது சதவீதத்தின் மதிப்பில் மதிப்புகளை எடுக்கலாம்.
இந்த நான்கு திணிப்புகளும் 20px ஆக இருக்கும்
மேல் மற்றும் கீழ் திணிப்பு 20px ஆக இருக்கும், வலது மற்றும் இடது ஆவணத்தின் மொத்த அகலத்தில் 10% இருக்கும் ஒரு அட்டவணையில் உள்ள அட்டவணை html
மேல் மற்றும் கீழ் திணிப்பு 20px ஆகவும், வலது திணிப்பு ஆவணத்தின் மொத்த அகலத்தில் 3% ஆகவும், கீழ் திணிப்பு மற்றும் மேல் திணிப்பு 20px ஆகவும் இருக்கும் வெளியீடு:
இதன் மூலம், CSS இல் பேடிங் குறித்த இந்த அற்புதமான கட்டுரையின் முடிவுக்கு வருகிறோம். நாங்கள் திணிப்பைச் சேர்க்கக்கூடிய பல்வேறு வழிகளைப் பற்றிய புரிதல் உங்களுக்கு கிடைத்தது என்று நம்புகிறேன்.
வலை அபிவிருத்தி பற்றி மேலும் அறிய நீங்கள் விரும்பினால், பாருங்கள் வழங்கியவர் எடுரேகா. HTML5, CSS3, Twitter பூட்ஸ்டார்ப் 3, jQuery மற்றும் Google API களைப் பயன்படுத்தி ஈர்க்கக்கூடிய வலைத்தளங்களை எவ்வாறு உருவாக்குவது மற்றும் அதை அமேசான் எளிய சேமிப்பக சேவைக்கு (S3) பயன்படுத்துவது எப்படி என்பதை அறிய வலை அபிவிருத்தி சான்றிதழ் பயிற்சி உதவும்.
நீங்கள் இன்னும் ஆர்வமாக இருந்தால், உங்களுக்கு ஏதேனும் கேள்வி இருந்தால், இந்த “பேடிங் இன் சிஎஸ்எஸ்” வலைப்பதிவின் கருத்துப் பிரிவில் இடுகையிடலாம், விரைவில் நாங்கள் உங்களிடம் வருவோம்.