PenTool UIتصفّح المكتبة

المكوّنات · جدول بيانات عربي

جدول بيانات عربي

الأرقام تُحاذى يسارًا داخل جدول يُقرأ يمينًا

2 تصاميم من هذه العائلة
جدول بيانات عربيجدول موظفين
متوسّط
<div class="mini adt">
  <table>
    <thead><tr>
      <th data-ar="الصنف" data-en="Item">الصنف</th>
      <th class="n" data-ar="الكمية" data-en="Qty">الكمية</th>
      <th class="n" data-ar="السعر" data-en="Price">السعر</th>
      <th class="s" data-ar="الحالة" data-en="Status">الحالة</th>
    </tr></thead>
    <tbody>
      <tr><td data-ar="رخصة سنوية" data-en="Annual license">رخصة سنوية</td>
          <td class="n">12</td><td class="n">1,200.00</td>
          <td class="s"><span class="dot ok"></span><span data-ar="نشط" data-en="Active">نشط</span></td></tr>
      <tr><td data-ar="تدريب فرق" data-en="Team training">تدريب فرق</td>
          <td class="n">3</td><td class="n">400.50</td>
          <td class="s"><span class="dot wait"></span><span data-ar="معلّق" data-en="Pending">معلّق</span></td></tr>
      <tr><td data-ar="دعم مميّز" data-en="Priority support">دعم مميّز</td>
          <td class="n">1</td><td class="n">9,840.75</td>
          <td class="s"><span class="dot ok"></span><span data-ar="نشط" data-en="Active">نشط</span></td></tr>
    </tbody>
    <tfoot><tr><td data-ar="المجموع" data-en="Total">المجموع</td><td class="n">16</td>
      <td class="n">11,441.25</td><td class="s"></td></tr></tfoot>
  </table>
</div>
← شريط كبسولي عائمحقل الاسم الرباعي →