يمكنك تضمين جدول في مشاركاتك على مدونتك بشكل جميل وأنيق متجاوب مع الشاشات المتعددة ومع الموقع يمكنك إستخدام هذا الجدول في الكثير من المشاركات، وهو مهم جدا للطلبة أو لإدراج مقارنات أو جداول المباريات وغيرها من الطرق المفيدة للجدول.<a name=\'more\'></a>
خطوات إضافة جدول في مشاركات مدونة بلوجر؟1. قم بانشاء مشاركة جديدة.2. حدد المكان الذي تريد إضافة جدول فيه داخل المشاركة ثم قم بالنقر على زر "html" من يمين مسودة المواضيع وأضف الكود التالي داخل المشاركة.
<style type="text/css">table,caption,tbody{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;}table{border-collapse:collapse;border-spacing:0;}.post-body table td,.post-body table caption{border:1px solid #e9e9e9;padding:10px;text-align:right;vertical-align:top;}.post-body table tr th{border:1px solid #457fdf;font-weight:bold;color:#fff;padding:15px 10px;text-align:right;vertical-align:top;font-size:14px}.post-body table th{background:#4285f4;}.post-body table.tr-caption-container{border:1px solid #f1f1f1;}.post-body table caption{border:none;font-style:italic;}.post-body td,.post-body th{vertical-align:top;text-align:right;font-size:13px;padding:3px 5px;}.post-body table tr:nth-child(even) > td {background-color:#f9f9f9;}.post-body table tr:nth-child(even) > td:hover {background-color:#fbfbfb;}.post-body td a{color:#768187;padding:0 6px;font-size:85%;float:left;display:inline-block;border-radius:3px}.post-body td a:hover{color:#7f9bdf;border-color:#adbce0;}.post-body tda[target="_blank"]:after {margin-right:5px;}.post-body table.tr-caption-container td{border:none;padding:8px;}.post-body table.tr-caption-container,.post-body table.tr-caption-container img,.post-body img{max-width:100%;height:auto;}.post-body td.tr-caption{color:#666;font-size:80%;padding:0px 8px 8px!important;}table{max-width:100%;width:100%;margin:1.5em auto;}table.section-columns td.first.columns-cell{border-right:none}table.section-columns{border:none;table-layout:fixed;width:100%;position:relative}table.columns-2 td.columns-cell{width:50%}table.columns-3 td.columns-cell{width:33.33%}table.columns-4 td.columns-cell{width:25%}table.section-columns td.columns-cell{vertical-align:top}table.tr-caption-container{padding:4px;margin-bottom:.5em}td.tr-caption{font-size:80%}</style>
عنوان 1: | عنوان 2 |
---|
جدول 1 | وصف الجدول او بما يقابله |
جدول 2 | وصف الجدول او بما يقابله |
جدول 3 | وصف الجدول او بما يقابله |
جدول 4 | وصف الجدول او بما يقابله |
جدول 5 | وصف الجدول او بما يقابله |
جدول 6 | وصف الجدول او بما يقابله |
جدول 7 | وصف الجدول او بما يقابله |
جدول 8 | وصف الجدول او بما يقابله |
جدول 9 | وصف الجدول او بما يقابله |
جدول 10 | وصف الجدول او بما يقابله |
<!-- Start HTML --> [p]<code><style type="text/css">table,caption,tbody{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;}table{border-collapse:collapse;border-spacing:0;}.post-body table td,.post-body table caption{border:1px solid #e9e9e9;padding:10px;text-align:right;vertical-align:top;}.post-body table tr th{border:1px solid #457fdf;font-weight:bold;color:#fff;padding:15px 10px;text-align:right;vertical-align:top;font-size:14px}.post-body table th{background:#4285f4;}.post-body table.tr-caption-container{border:1px solid #f1f1f1;}.post-body table caption{border:none;font-style:italic;}.post-body td,.post-body th{vertical-align:top;text-align:right;font-size:13px;padding:3px 5px;}.post-body table tr:nth-child(even) > td {background-color:#f9f9f9;}.post-body table tr:nth-child(even) > td:hover {background-color:#fbfbfb;}.post-body td a{color:#768187;padding:0 6px;font-size:85%;float:left;display:inline-block;border-radius:3px}.post-body td a:hover{color:#7f9bdf;border-color:#adbce0;}.post-body tda[target="_blank"]:after {margin-right:5px;}.post-body table.tr-caption-container td{border:none;padding:8px;}.post-body table.tr-caption-container,.post-body table.tr-caption-container img,.post-body img{max-width:100%;height:auto;}.post-body td.tr-caption{color:#666;font-size:80%;padding:0px 8px 8px!important;}table{max-width:100%;width:100%;margin:1.5em auto;}table.section-columns td.first.columns-cell{border-right:none}table.section-columns{border:none;table-layout:fixed;width:100%;position:relative}table.columns-2 td.columns-cell{width:50%}table.columns-3 td.columns-cell{width:33.33%}table.columns-4 td.columns-cell{width:25%}table.section-columns td.columns-cell{vertical-align:top}table.tr-caption-container{padding:4px;margin-bottom:.5em}td.tr-caption{font-size:80%}</style></code><code></code><code>
</code><code> عنوان 1: | عنوان 2 |
</code><code> جدول 1 | وصف الجدول او بما يقابله |
</code><code> جدول 2 | وصف الجدول او بما يقابله |
</code><code> جدول 3 | وصف الجدول او بما يقابله |
</code><code> جدول 4 | وصف الجدول او بما يقابله |
</code><code> جدول 5 | وصف الجدول او بما يقابله |
</code><code> جدول 6 | وصف الجدول او بما يقابله |
</code><code> جدول 7 | وصف الجدول او بما يقابله |
</code><code> جدول 8 | وصف الجدول او بما يقابله |
</code><code> جدول 9 | وصف الجدول او بما يقابله |
</code><code> جدول 10 | وصف الجدول او بما يقابله |
</code><code>
</code><code></code></pre><!-- End HTML -->
طبعا يمكنك زيادة أو حذف الأسطر من خلال إضافة المزيد أو حذف:[/b]< tr > < td > جدول 1 < / td > < td > وصف الجدول او بما يقابله </ td > < / tr >[b]كما يمكن إزالة العنوان من خلال حذف السطر:< tr > < th > عنوان 1 : < / th > < th > عنوان 2 < / th > < /tr >3. بعد ذلك يمكن النقر على "تاليف والتعديل على الجدول ومن ثم نشر المشاركة