رئيسية المعهد
رئيسية المعهد  تواصل معنا  حقوق الملكية الفكرية  اربط مدونتك بنا  محول أكواد أدسنس

 
قديم 07-19-2012, 12:56 PM   #1
admin
مدير عام
 
الصورة الرمزية admin
 
تاريخ التسجيل: Apr 2012
الدولة: جده
المشاركات: 2,846
Thumbs up شرح إنشاء جداول إحترافية على مدونات بلوجر

أنا : admin




بسم الله الرحمن الرحيم
في هذا الموضوع سنتناول شرحا لإنشاء جداول إحترافية في مواضيعكم على مدونات بلوجر.

أولا صورة للجدول :



مثال حي : تجربة إنشاء جداول على بلوجر

شرح الإضافة :
أولا نضيف كود CSS الخاص بتنسيق الجدول :
اذهب إلى تحرير HTML وعلم على توسيع قوالب عناصر واجهة المستخدم والصق الكود التالي مباشرة قبل
]]></b:skin> :

كود:
#bloggerexp-table {
    font-family: "Lucida Sans Unicode", "Lucida Grande", Sans-Serif;
    font-size: 12px;
    margin: 10px 0;
    width: 100%;
    text-align: right;
    border-collapse: collapse;
}
#bloggerexp-table th {
    font-size: 13px;
    font-weight: normal;
    padding: 8px;
    background: #b9c9fe  url('http://4.bp.blogspot.com/_xDpoN6UfFFY/S-J2gjh1nPI/AAAAAAAACbg/7lNsVpks2oY/s1600/gradhead.png')  repeat-x;
    border-top: 2px solid #d3ddff;
    border-bottom: 1px solid #fff;
    color: #039;
}
#bloggerexp-table td {
    padding: 8px;
    border-bottom: 1px solid #fff;
    color: #669;
    border-top: 1px solid #fff;
    background: #e8edff  url('http://1.bp.blogspot.com/_xDpoN6UfFFY/S-J2f5yBC3I/AAAAAAAACbY/zWXYXsR-w5E/s1600/gradback.png')  repeat-x;
}
#bloggerexp-table tfoot tr td {
    background: #e8edff;
    font-size: 16px;
    color: #99c;
    text-align:center;
}
#bloggerexp-table tbody tr:hover td {
    background: #d0dafd  url('http://4.bp.blogspot.com/_xDpoN6UfFFY/S-J2hsztUzI/AAAAAAAACbo/ztV1CK0RUrE/s1600/gradhover.png')  repeat-x;
    color: #339;
}
#bloggerexp-table a:hover {
    text-decoration:underline;
}
الآن عند إضافة موضوع جديد إذهب إلى رسالة جديدة ثم تحرير HTML والصق الكود التالي :

كود:
<table id="bloggerexp.com-table" summary="وصف محتوى الجدول">
   <thead>
     <tr>
       <th scope="col">التصنيف الأول</th>
       <th scope="col">التصنيف الثاني</th>
       <th scope="col">التصنيف الثالث</th>
       <th scope="col">التصنيف الرابع</th>
       <th scope="col">التصنيف الخامس</th>
     </tr>
   </thead>
   <tfoot>
     <tr>
       <td colspan="5">وصف محتوى الجدول</td>
     </tr>
   </tfoot>
   <tbody>
    <tr>
       <td>الخانة الأولى المرتبطة بالتصنيف الأول / السطر الأول</td>
       <td>الخانة الثانية المرتبطة بالتصنيف الثاني / السطر الأول</td>
       <td>الخانة الثالثة المرتبطة بالتصنيف الثالث / السطر الأول</td>
       <td>الخانة الرابعة المرتبطة بالتصنيف الرابع / السطر الأول</td>
       <td>الخانة الخامسة المرتبطة بالتصنيف الخامس / السطر الأول</td>
     </tr>
    <tr>
        <td>الخانة الأولى المرتبطة بالتصنيف الأول / السطر الثاني</td>
       <td>الخانة الثانية المرتبطة بالتصنيف الثاني / السطر الثاني</td>
       <td>الخانة الثالثة المرتبطة بالتصنيف الثالث / السطر الثاني</td>
       <td>الخانة الرابعة المرتبطة بالتصنيف الرابع / السطر الثاني</td>
       <td>الخانة الخامسة المرتبطة بالتصنيف الخامس / السطر الثاني</td>
     </tr>
    <tr>
        <td>الخانة الأولى المرتبطة بالتصنيف الأول / السطر الثالث</td>
       <td>الخانة الثانية المرتبطة بالتصنيف الثاني / السطر الثالث</td>
       <td>الخانة الثالثة المرتبطة بالتصنيف الثالث / السطر الثالث</td>
       <td>الخانة الرابعة المرتبطة بالتصنيف الرابع / السطر الثالث</td>
       <td>الخانة الخامسة المرتبطة بالتصنيف الخامس / السطر الثالث</td>
      </tr>
     <tr>
        <td>الخانة الأولى المرتبطة بالتصنيف الأول / السطر الرابع</td>
       <td>الخانة الثانية المرتبطة بالتصنيف الثاني / السطر الرابع</td>
       <td>الخانة الثالثة المرتبطة بالتصنيف الثالث / السطر الرابع</td>
       <td>الخانة الرابعة المرتبطة بالتصنيف الرابع / السطر الرابع</td>
       <td>الخانة الخامسة المرتبطة بالتصنيف الخامس / السطر الرابع</td>
     </tr>
     <tr>
        <td>الخانة الأولى المرتبطة بالتصنيف الأول / السطر الخامس</td>
       <td>الخانة الثانية المرتبطة بالتصنيف الثاني / السطر الخامس</td>
       <td>الخانة الثالثة المرتبطة بالتصنيف الثالث / السطر الخامس</td>
       <td>الخانة الرابعة المرتبطة بالتصنيف الرابع / السطر الخامس</td>
       <td>الخانة الخامسة المرتبطة بالتصنيف الخامس / السطر الخامس</td>
     </tr>
   </tbody>
 </table> 


إذا أعجبك الموضوع اضغط زر الإعجاب الخاص بالفيسبوك أسفله. أي استفسار لا تتردد بطرحه :D

الدعم العربي

admin غير متواجد حالياً   رد مع اقتباس

مركز رفع موسوعة العربية
قديم 07-19-2012, 06:04 PM   #2
REDA
مدون مميز
 
الصورة الرمزية REDA
 
تاريخ التسجيل: Apr 2012
المشاركات: 441
إرسال رسالة عبر Yahoo إلى REDA
افتراضي رد: شرح إنشاء جداول إحترافية على مدونات بلوجر

أنا : REDA




الف شكر يامعلم ... :)

الدعم العربي

REDA غير متواجد حالياً   رد مع اقتباس
قديم 07-21-2012, 03:09 PM   #3
abdellah
مدون جديد
 
تاريخ التسجيل: Jul 2012
المشاركات: 33
افتراضي رد: شرح إنشاء جداول إحترافية على مدونات بلوجر

أنا : abdellah




شكرا على الموضوع
__________________

من مواضيع abdellah

الدعم العربي

abdellah غير متواجد حالياً   رد مع اقتباس
قديم 08-01-2012, 02:33 AM   #4
admin
مدير عام
 
الصورة الرمزية admin
 
تاريخ التسجيل: Apr 2012
الدولة: جده
المشاركات: 2,846
افتراضي رد: شرح إنشاء جداول إحترافية على مدونات بلوجر

أنا : admin




اقتباس:
المشاركة الأصلية كتبت بواسطة REDA مشاهدة المشاركة
الف شكر يامعلم ... :)
اقتباس:
المشاركة الأصلية كتبت بواسطة abdellah مشاهدة المشاركة
شكرا على الموضوع
شكرا على مروركم

الدعم العربي

admin غير متواجد حالياً   رد مع اقتباس
قديم 08-31-2012, 11:34 PM   #5
ULMovies
مدون جديد
 
الصورة الرمزية ULMovies
 
تاريخ التسجيل: Aug 2012
المشاركات: 11
افتراضي رد: شرح إنشاء جداول إحترافية على مدونات بلوجر

أنا : ULMovies




الله عليك يا عثمان رهييب والله
رائع جداً
ألف شكر

الدعم العربي

ULMovies غير متواجد حالياً   رد مع اقتباس
قديم 09-05-2012, 05:21 PM   #6
ism33ail
مدون نشيط
 
الصورة الرمزية ism33ail
 
تاريخ التسجيل: Jun 2012
الدولة: المغرب
المشاركات: 228
افتراضي رد: شرح إنشاء جداول إحترافية على مدونات بلوجر

أنا : ism33ail




كلمة واحدة : إحتراف

الدعم العربي

ism33ail غير متواجد حالياً   رد مع اقتباس
إضافة رد

مواقع النشر (المفضلة)

الكلمات الدليلية (Tags)
مدونة, بلوجر, جداول, شرح, إحترافية, إنشاء


 
أدوات الموضوع
انواع عرض الموضوع

ضوابط المشاركة
لا تستطيع إضافة مواضيع جديدة
لا تستطيع الرد على المواضيع
لا تستطيع إرفاق ملفات
لا تستطيع تعديل مشاركاتك

كود [IMG]متاحة
كود HTML معطلة



المواضيع المتشابهه
الموضوع كاتب الموضوع المنتدى مشاركات آخر مشاركة
إنشاء منتدى داخل مدونات بلوجر للتفاعل مع الزوار mohssine ait دروس بلوجر 5 04-27-2013 09:09 PM
كيفية إنشاء منتدى على مدونات بلوجر !! مصري وافتخر دروس بلوجر 0 01-18-2013 03:01 AM
.. دورة إنشاء مدونة إحترافية + كتاب إلكتروني .. efada.net دروس بلوجر 2 11-08-2012 11:49 PM
الدرس الثالت .. دورة إنشاء مدونة إحترافية efada.net دروس بلوجر 1 10-01-2012 01:31 PM
الدرس الأول .. دورة إنشاء مدونة إحترافية efada.net دروس بلوجر 1 08-18-2012 04:27 PM





لتصفح أفضل وللاستفادة القصوى من خصائص المعهد ننصحكم باستعمال :

Powered by vBulletin™ Version 3.8.7
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved. منتديات
new notification by 9adq_ala7sas
Developed By Marco Mamdouh
معهد خبراء بلوجر - 2012 Google
أعلن على المعهد : اتصل بنا - منتدي كنوز - الدعم العربي - قوالب بلوجر - او او انيمي
رئيسية المعهد
الساعة الآن 04:29 PM - بتوقيت جرينتش
المعهد غير مسؤول عن أي اتفاق تجاري أو تعاوني بين الأعضاء
فعلى كل شخص تحمل مسؤولية نفسه تجاه ما يقوم به من بيع وشراء وإتفاق وإعطاء معلومات مدونته
التعليقات المنشورة لا تعبر عن رأي معهد خبراء البلوجر ولا نتحمل أي مسؤولية قانونية حيال ذلك
(ويتحمل كاتبها مسؤولية النشر)