டெயில்விண்டில் பிளாக்-லெவல் ஃப்ளெக்ஸ் கண்டெய்னரை உருவாக்குவது எப்படி?

Teyilvintil Pilak Leval Hpleks Kanteynarai Uruvakkuvatu Eppati



ஃப்ளெக்ஸ்பாக்ஸ் அல்லது ஃப்ளெக்ஸ் கொள்கலன் என்பது ஒரு கொள்கலனில் உள்ள கூறுகளை சீரமைக்கவும் விநியோகிக்கவும் பயனர்களுக்கு உதவும் தளவமைப்பு ஆகும். டெயில்விண்ட் CSS ஆனது ஃப்ளெக்ஸ்பாக்ஸை உருவாக்க மற்றும் வேலை செய்ய பல்வேறு பயன்பாட்டு வகுப்புகளை வழங்குகிறது. பாக்ஸ்-லெவல் ஃப்ளெக்ஸ் கொள்கலன் என்பது ஒரு ஃப்ளெக்ஸ் கொள்கலன் ஆகும், இது ஒரு தொகுதி-நிலை உறுப்பு போல செயல்படுகிறது/செயல்படுகிறது மற்றும் ஒரு தொகுதியை உருவாக்குகிறது. இது அதன் மூல உறுப்பின் முழு அகலத்தையும் எடுத்துக் கொண்டு அதன் பிறகு ஒரு புதிய வரியை உருவாக்குகிறது.

டெயில்விண்டில் பிளாக்-லெவல் ஃப்ளெக்ஸ் கன்டெய்னரை உருவாக்கும் முறையை இந்த எழுதுதல் எடுத்துக்காட்டும்.







டெயில்விண்டில் பிளாக்-லெவல் ஃப்ளெக்ஸ் கண்டெய்னரை உருவாக்குவது/உருவாக்குவது எப்படி?

டெயில்விண்டில் ஒரு குறிப்பிட்ட பிளாக்-லெவல் ஃப்ளெக்ஸ் கொள்கலனை உருவாக்க, ஒரு HTML கட்டமைப்பை உருவாக்கவும். பின்னர், '' நெகிழ்வு ” பயன்பாட்டு வகுப்பை விரும்பிய

மற்றும் அதன் குழந்தை கூறுகளைக் குறிப்பிடவும். இது அதன் மூல உறுப்பின் (உலாவி) முழு அகலத்தையும் ஆக்கிரமித்து, அதன் பிறகு ஒரு புதிய வரியை உருவாக்கும்.



தொடரியல்



< div வர்க்கம் = 'நெகிழ்...' >
...
div >


குறியீடு





< உடல் >

< div வர்க்கம் = 'ஃப்ளெக்ஸ் கேப்-2 மீ-2 பார்டர்-2 பார்டர்-கருப்பு' >
< div வர்க்கம் = 'bg-yellow-500 p-4' > முதல் பொருள் div >
< div வர்க்கம் = 'bg-yellow-500 p-4' > இரண்டாவது பொருள் div >
< div வர்க்கம் = 'bg-yellow-500 p-4' > மூன்றாவது உருப்படி div >
div >

உடல் >


இங்கே, பெற்றோர்

கொள்கலனில்:

    • ' நெகிழ்வு 'வகுப்பு ஒரு தொகுதி-நிலை நெகிழ்வு கொள்கலனை உருவாக்க பயன்படுத்தப்படுகிறது.
    • ' இடைவெளி-2 ” வகுப்பு ஃப்ளெக்ஸின் குழந்தை உறுப்புகளுக்கு இடையே 2 யூனிட் இடைவெளியைச் சேர்க்கிறது.
    • ' மீ-2 ”வகுப்பு கன்டெய்னரின் எல்லா பக்கங்களிலும் 2 யூனிட் மார்ஜினை சேர்க்கிறது.
    • ' எல்லை-2 ” வகுப்பு 2 அலகுகள் அகலம் கொண்ட கொள்கலனில் பார்டரை சேர்க்கிறது.
    • ' எல்லை-கருப்பு ” வகுப்பு எல்லை நிறத்தை கருப்பு நிறமாக அமைக்கிறது.

குழந்தை நெகிழ்வு கூறுகளில்:



    • ' பிஜி-மஞ்சள்-500 ” வகுப்பு ஃப்ளெக்ஸ் உருப்படியின் பின்னணியில் மஞ்சள் நிறத்தைப் பயன்படுத்துகிறது.
    • ' ப-4 'வகுப்பு ஃப்ளெக்ஸ் உருப்படிகளின் அனைத்து பக்கங்களிலும் 4 அலகுகளின் திணிப்பை சேர்க்கிறது.

வெளியீடு


மேலே உள்ள வெளியீட்டில், கன்டெய்னர் ஒரு பிளாக்-லெவல் ஃப்ளெக்ஸ் கன்டெய்னர் என்பதை பார்டர் குறிக்கிறது, இது அதன் மூல உறுப்பு (உலாவி) முழு அகலத்தையும் ஆக்கிரமிக்கிறது.

மாற்றாக, வலைப்பக்கத்தில் ஃப்ளெக்ஸ் கொள்கலன் உறுப்பைப் பரிசோதிப்பதன் மூலம் பயனர் இதை உறுதிசெய்யலாம்:


மேலே உள்ள வெளியீடு, கொள்கலன் ஒரு தொகுதி-நிலை நெகிழ்வு கொள்கலன் என்பதைக் குறிக்கிறது.

முடிவுரை:

டெயில்விண்டில் பிளாக்-லெவல் ஃப்ளெக்ஸ் கொள்கலனை உருவாக்க, '' நெகிழ்வு ” குறிப்பிட்ட கொள்கலனுடன் பயன்பாட்டு வகுப்பு மற்றும் அதன் குழந்தை கூறுகளைக் குறிப்பிடவும். பயனர்கள் தங்கள் தேவைகளுக்கு ஏற்ப ஃப்ளெக்ஸ் பொருட்களை வரையறுத்து மாற்றலாம். சரிபார்ப்புக்கு, கண்டெய்னரில் பார்டரைச் சேர்த்து, இணையப் பக்கத்தைப் பார்க்கவும் அல்லது இணையப் பக்கத்தில் அந்த உறுப்பைப் பார்க்கவும். டெயில்விண்டில் பிளாக்-லெவல் ஃப்ளெக்ஸ் கொள்கலனை உருவாக்கும் முறையை இந்தக் கட்டுரை விளக்கியுள்ளது.