شرح تأطير الصوره الرمزيه+عمل صورة رمزيه افتراضيه لجميع الاعضاء بالcss وتأطيرها







السلام عليكم ورحمة الله وبركاته

 شرح تأطير الصوره الرمزيه+عمل صوره رمزيه افتراضيه لـ جميع الاعضاء بالcss + تأطير الصوره الرمزيه الإفتراضيه اليوم سنتعلم تأطير الصوره الرمزيه + عمل صوره رمزيه افتراضيه لـ جميع الاعضاء بالcss + تأطير الصوره الرمزيه الإفتراضيه

 لـ نشاهد المثال قبل

بعد

كم بالشرح السابق نتوجه إلى القوالب قالب postbit_legacy نفتح القالب او البحث عن القوالب >>>البحث في الستايل اختار الستايل المراد التعديل عليه>>>بحث عن النص نضع التالي postbit_legacy >>>واخيراً نضغط بحث

نفتح القالب بالضغط على كلمة postbit_legacy مرتين بالماوس وننسخه ونضعه في اي برنامج تحرير ولـ نفترض برنامج المفكرة

نبحث عن

رمز PHP:
<if condition="$show['avatar']"

ننسخ من

رمز PHP:
<if condition="$show['avatar']"إلى </if> 

ليصبح الكود

رمز Code:

            <if condition="$show['avatar']">
                <div class="smallfont">
                    &nbsp;<br /><a   href="member.php?$session[sessionurl]u=$post[userid]"><img   src="$post[avatarurl]" $post[avwidth] $post[avheight] alt="<phrase   1="$post[username]">$vbphrase[xs_avatar]</phrase>" border="0"   /></a>
                </div>
            </if>

في شرحنا لتأطير التوقيع كان التأطير جزء جزء مقسم يمين يسار فوق تحت اما الان سيكون شرحنا تاطير كامل وليس مجزء بإستخدام الامرborder نضع الكود كما تعودنا إضافة كلاسات ولاكن الان الكلاسات موجوده فقط تعديل الكلاس الإفتراضي نعدل smallfont إلى os61 وبعد التعديل سيصبح الكلاس كـ التالي

رمز Code:


             <if condition="$show['avatar']">
                <div class="os">
                    &nbsp;<br /><a   href="member.php?$session[sessionurl]u=$post[userid]"><img   src="$post[avatarurl]" $post[avwidth] $post[avheight] alt="<phrase   1="$post[username]">$vbphrase[xs_avatar]</phrase>" border="0"   /></a>
                </div>
</if>

انتهينا من عمل كلاس لـ الصوره الرمزيه المُختاره من قبل العضو سنتعلم إضافة الاومر بالاخير الان ننتقل لـ عمل صور رمزيه إفتراضيه وبالcss طبعاً اولاً امر الفصل

رمز Code:
<else />

طبعاً سنعمل امر الفصل قبلif سيصبح هكذ

رمز Code:
 <div/>
<else/>


<if/>

سوف يصبح الكود كـ التالي

رمز Code:
 <if condition="$show['avatar']">
<div class="os">
&nbsp;<br /><a   href="member.php?$session[sessionurl]u=$post[userid]"><img   src="$post[avatarurl]" $post[avwidth] $post[avheight] alt="<phrase   1="$post[username]">$vbphrase[xs_avatar]</phrase>" border="0"   /></a>
<div/>
<else/>


<if/>

طبعاً لو تلاحظُ قمت بـ عمل سطرين فارغين بين الelse والif فهذا لـ نعمل الصوره الإفتراضي اولاً سنعمل div كـ التالي

رمز Code:
<div>
هنا كود الصوره الإفتراضيه
<div/>

الان سنعمل كلاس

رمز PHP:
<div class> 

سيصبح كـ التالي طبعاً لا ننسى ال= والفاصلتين المنقوطتين" سيصبح الكلاس كـ التالي

رمز Code:
 <div class="os2">
هنا كود الصوره الإفتراضيه
   </div>

طبعاً مع عمل اسم للكلاس بـ اسم os2 سوف نعمل الرابط للملف الشخصي member.php?$session[sessionurl]u=$post[userid

سيصبح كـ التالي

رمز Code:


    <div class="">
<a href="member.php?$session[sessionurl]u=$post[userid]"></a>
   </div>

فقط رابط للملف الشخصي لمن يود ان يكون هناك وصف او ماشابه فـ يعمله بنفسه الامرtitle المهم الان انتهينا من عمل الاكواد تبقى اكواد الtype css سـ نبدأ بـ عمل الكلاس الاول وهو os1 نبدأ طبعاً كتابة الاوامر كـ التالي

رمز Code:
.os {
هنا الاوامر
}

احبتي في الله هذه ملاحظه هامه طبعاً التأطير الاول إذا تركناها هكذا .os{} سيصبح معنا تأطير الdiv كاملاً ولاكن نود تأطير الصوره بـ وضع img

رمز Code:

ويصبح كـ التالي
.os img {
هنا اوامر الكلاس
}

طبعاً للصوره الرمزيه لايحتاج التشويه الإطار الذي بالاسفل لون والإيطار الذي بالاعلى لون فـ سنجمع التأطير كاملاً بـ امر واحد ولون واحد وحجم واحد للاطار كاملاً الامر هو border ويصبح الامر كـ التالي

رمز PHP:
border:2px black double 

وهذا الامر لـ تأطير div طبعاً وضعنا الكود img يعني تأطير الimg فقط الصوره فقط

رمز Code:
.os img {
 border:2px black double;
}

لا ننسى دائماً في نهاية اخر امر يكون وسم الإغلاق الفاصله المنقوطه ; انتهينا من عمل الامر الاول للكلاس الصوره المختاره تبقى لنا عمل الصوره الإفتراضيه + تأطيرها + عمل حجم لها سنبدأ كم تعلمنا

رمز Code:

.os2 {
هنا اوامر الكلاس
 }

طبعاً سابقاً عملنا للصوره فقط الان سوف نعمل للdiv كاملاً نبدأ بـ عمل الاوامر الصوره الإفتراضيه + لون للصوره + عمل الصوره بدون تكرار no repeat

رمز PHP:
background:white url('http://www.os6ora-3d.com/vb/images/loai.gif'no-repeat

التأطير الكامل للdiv

border:1px dotted #000000

العرض width: 140px الطول height: 140px طبعاً كم قلت سابقاً لا ننسى الفاصله المنقوطه بعد كُل امر ;

تم الانتهاء من الشرح

الكود كامل لـ داخل القالب postbit_legacy

رمز Code:


            <if condition="$show['avatar']">
                <div class="os1">
                    &nbsp;<br /><a   href="member.php?$session[sessionurl]u=$post[userid]"><img   src="$post[avatarurl]" $post[avwidth] $post[avheight] alt="<phrase   1="$post[username]">$vbphrase[xs_avatar]</phrase>" border="0"   /></a>
                </div>
                
                <else />
                <div class="os2">
                <a href="member.php?$session[sessionurl]u=$post[userid]"></a>
                </div>
</if>

الكود الذي في خيارات الcss الإضافيه

رمز Code:

.os1 img {
 border:2px black double;
}

.os2 {
 background:white url('http://www.os6ora-3d.com/vb/images/loai.gif') no-repeat;
 border:1px dotted #000000;
 height: 140px;
 width: 140px;
 }

http://www.traidnt.net/vb/showthread.php?t=1837465