ما هو الغرض من خلية الجدول في Tailwind

أثناء التعامل مع مجموعات كبيرة من البيانات ، من المهم إنشاء نظام فهم. يساعد ذلك في إدارة جميع القيم ويمكّننا من استخلاص استنتاجات قيمة من البيانات التي نجمعها واتخاذ قرارات مستنيرة. هناك العديد من التقنيات الفعالة لتمثيل البيانات ومن أهمها في شكل جداول.

الغرض من خلية الجدول

خلية الجدول هي إدخال فردي داخل جدول يتكون من عدد من الخلايا الأخرى مثلها تمامًا. الغرض الرئيسي من خلية الجدول هو تسجيل البيانات بطريقة منظمة لتسهيل الفهم والفهم. يشير إلى موضع معين داخل الجدول الذي يتم فيه تضمين الإدخال.

أنواع خلايا الجدول

يحتوي الجدول في HTML بشكل أساسي على نوعين من الخلايا. هؤلاء هم ' خلايا الرأس ' و ' خلايا البيانات '. ويرد أدناه مزيد من التفاصيل حول الاختلافات والتشابه بينهما.

خلايا الرأس

يتم تمثيل خلايا الرأس بـ ' 'في HTML Tailwind CSS. هذه تشكل عناوين الأعمدة في الجدول. تحدد الرؤوس ما ستكون عليه جميع القيم في عمود معين. أمثلة على الرؤوس هي الاسم وعنوان البريد الإلكتروني ورقم جهة الاتصال ورقم الضمان الاجتماعي وما إلى ذلك.

ستكون خلية رأس الجدول في الجزء العلوي من العمود وستكون الإدخالات أدناه هي خلايا البيانات. تحتوي هذه الخلايا أيضًا على تنسيق محدد لتمييزها عن خلايا البيانات التالية. يتم تحديد خلايا الرأس بحيث يكون لها حجم خط أكبر وأحرف غامقة لإضافة معنى إلى المحتوى في خلايا البيانات.

مثال
في الكود أدناه ، أنشأنا خلية رأس جدول عبر علامة '':

< طاولة >
< thead >
< آر >
< ذ > خلية الرأس 01 < / ذ >
< / آر >
< / thead >
< / طاولة >

في هذا الجزء من الكود:

قم بإنشاء جدول عبر علامة “”.
الآن ، استخدم العلامة '
'.
أخيرًا ، أغلق علامات '
' و '' و '

' لإنشاء خلية رأس جدول.
ثم حدد إدخال الخلية ' خلية الرأس 01 'باستخدام العلامة'
'داخل علامة'

' ، على التوالي لإكمال خلية الجدول.

انتاج |

كما رأينا ، يتم عرض خلية الرأس بخط غامق افتراضيًا.

خلايا البيانات

يتم تمثيل خلايا البيانات بواسطة ' 'في HTML Tailwind CSS. تحتوي هذه الخلايا على جميع المعلومات الموجودة في الجدول. يتم سردها أسفل خلايا الرأس وتحتوي على بيانات لجميع الإدخالات الخاصة برأس معين. على سبيل المثال ، إذا كانت خلية العنوان هي 'الاسم' ، فستحتوي خلايا البيانات الموجودة أدناه على أسماء جميع الموظفين الذين يتم تسجيل البيانات لهم.

تحتوي خلايا البيانات أيضًا على تنسيق خاص. هذه لها حجم خط أصغر من خلايا الرأس وتحتوي على نص عادي أو أرقام ، حسب المتطلبات. وهكذا فإن خلايا البيانات الموجودة ضمن خلية العنوان 'الاسم' ستحتوي على أسماء الأفراد المعنيين على سبيل المثال جون وديفيد ومايكل وجيمس.

مثال
الكود لإنشاء خلية بيانات جدول باستخدام '

'العلامة أدناه: < رأس >
< أسلوب >
طاولة {
انهيار الحدود: انهيار.
}
td {
حدود : أسود صلب 1 بكسل ؛
الحشو: 10 بكسل ؛
}
< / أسلوب >
< / رأس >
< جسم >
< طاولة >
< آر >
< td > خلية الجدول < / td >
< / آر >
< / طاولة >

توضح الخطوات التالية التعليمات البرمجية لإنشاء خلية بيانات جدول:

تحدد العلامة '