اختر لونك:
وَقُلِ اعْمَلُوا فَسَيَرَى اللَّهُ عَمَلَكُمْ وَرَسُولُهُ وَالْمُؤْمِنُونَ ۖ وَسَتُرَدُّونَ إِلَىٰ عَالِمِ الْغَيْبِ وَالشَّهَادَةِ فَيُنَبِّئُكُم بِمَا كُنتُمْ تَعْمَلُونَ [ التوبة : ( 105 )] كلمة الإدارة

يرجى إختيار القسم المناسب قبل النشر وسيعاقب المخالف بإنذار أول مرة وسيتم حظره إذا تكرر ذلك كلمة الإدارة

يُمنع كتابة مواضيع السحر والشعوذة والروحانيات والابراج بكافة الأشكال والمخالف سيعاقب بحظر مؤقت وإذا تكرر سيكون حظر دائم تنبيه هام جداً



أضف رد جديد
 
LinkBack أدوات الموضوع انواع عرض الموضوع

قديم 05-04-2019, 01:27 PM   #1
تاريخ التسجيل: Feb 2019
المشاركات: 1,010
التقييم: 10
تاريخ التسجيل: Feb 2019
المشاركات: 1,010
التقييم: 10
افتراضي الأصناف “iron”، “nightster” و “fortyeight” خلفيّة بيضاء شفّافة باستخدام RGBa

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

CSS الكامل
body, div, h1, h2, h3, h4, h5, h6, p, ul, ol, li, dl, dt, dd, img, form, fieldset, input, textarea, blockquote, table, tr, td, th {
margin: 0; padding: 0; border: 0;
}

body {
background: #000 url(images/bg.jpg) center top fixed no-repeat;
font: 16px Georgia, Serif; color: #ccc;
}

h1 {
width: 168px; height: 130px; margin: 30px auto; position: relative;
background: url(images/harley-davidson.png); text-indent: -9999px;
}

#container {
width: 940px; margin: -115px auto; padding: 110px 10px 50px 10px;
background: url(images/bg-pattern.png);
box-shadow: 0px 0px 15px #000;
}

table {
border-spacing: 10px 0px;
}

th, td {
text-align: center; padding: 10px;
}

.feature {
width: 183px; text-align: right;
font-size: 24px; font-weight: normal; color: #fff;
}

.iron, .nightster, .fortyeight {
background: rgba(255,255,255,0.05);
}

h2 {
font-size: 24px; font-weight: normal; color: #fff;
}

tr:hover {
background: rgba(255,255,255,0.05);
}
thead tr:hover {
background: none;
}
جدول HTML / CSS النهائي
الأصناف “iron”، “nightster” “fortyeight” خلفيّة

تحقّق بنفسك من المثال لرؤية الشكل النهائي للجدول بكلّ التّأثيرات التي ترافقه. استخدام الشفافية من ملفّات PNG24 وصيغة التّلوينRGBa ساعد على إنشاء تصميم أنيق عندما دُمج مع صورة الخلفية الكبيرة.
عمومًا تقنيات الجدول البسيطة هذه يمكن استخدامها في أيّ مشروع لعرض بياناتك الجدولية بطريقة واضحة وسهلة الفهم.

الفارس غير متواجد حالياً   اقتباس
أضف رد جديد

الكلمات الدلالية (Tags)
منتديات رحيل, رحيل, شبكة رحيل, r7il, r7il.com


الذين يشاهدون محتوى الموضوع الآن : 1 ( الأعضاء 0 والزوار 1)
 

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

BB code is متاحة
كود [IMG] متاحة
كود HTML معطلة
Trackbacks are متاحة
Pingbacks are متاحة
Refbacks are متاحة



الساعة الآن 02:54 AM

 


Content Relevant URLs by vBSEO ©2010, Crawlability, Inc.