طھط£ط·ظٹط± ط¬ط¯ط§ظˆظ„ ط§ظ„ظ…ظ†طھط¯ظ‰ ط¨طھظ‚ظ†ظٹط© css3


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

كيف الحــــــــــــــــــــال ؟
إن شاء الله الجميع بكل صحة و عافية


أولا و قبل البدأ أشرح طريقة لكم الكود code



ننسخ الكود code مرتين و نضيف قبله
-moz- و -webkit- و ذلك حتى تدعمه المتصفحات



الآن ، من لوحة تحكم المنتدى forum >> الستايل styleات و القوالب ،

نختار الستايل style الذي نريد العمل عليه ثم ننتقل إلى حدود الجدول

و نضيف الكود code في خواص CSS الإضافية


طبعا يمكنكم التعديل على الكود code كما تشاؤون ، اللون ، الحجم ، التشويش و و و

و هذه مجموعة من النتائج التي تحصلت عليها بعد التعديل

أولا : تأطير بلون واحد


رمز PHP:
<code style="white-space:nowrap"> <code> border: 1px solid #ffffff;
-moz-box-shadow: 1px 1px 0px 5px #2099bf;
-webkit-box-shadow: 1px 1px 0px 5px #dadada;
box-shadow: 1px 1px 0px 5px #dadada;
</code> </code>





ثانيا : التأطير بلونين

رمز PHP:
<code style="white-space:nowrap"> <code>
border: 1px solid #ffffff;
-moz-box-shadow: 0px 0px 0px 3px #2099bf,



0px 0px 0px 6px #cd0000;
-webkit-box-shadow: 1px 1px 0px 3px #2099bf,
0px 0px 0px 6px #cd0000;
box-shadow: 0px 0px 0px 3px #2099bf,
0px 0px 0px 6px #cd0000;
</code> </code>





ثالثا : تغيير الإزاحة

رمز PHP:
<code style="white-space:nowrap"> <code> border: 1px solid #ffffff;
-moz-box-shadow: 3px 3px 0px 3px #2099bf,
0px 0px 0px 6px #cd0000;
-webkit-box-shadow: 3px 3px 0px 3px #2099bf,
0px 0px 0px 6px #cd0000;
box-shadow: 3px 3px 0px 3px #2099bf,
0px 0px 0px 6px #cd0000;
</code> </code>




رابعا : تغيير مقدار التشويش

رمز PHP:
<code style="white-space:nowrap"> <code> border: 1px solid #ffffff;
-moz-box-shadow: 1px 1px 3px 3px #2099bf;
-webkit-box-shadow: 1px 1px 3px 3px #dadada;
box-shadow: 1px 1px 3px 3px #dadada;
</code> </code>






خامسا

رمز PHP:
<code style="white-space:nowrap"> <code> border: 1px solid #ffffff;
-moz-box-shadow: 0px 0px 0px 3px #dadada,
1px 0px 0px 4px #229fc6,
-1px 0px 0px 4px #229fc6;
-webkit-box-shadow: 0px 0px 0px 3px #dadada,
1px 0px 0px 3px #229fc6;
-1px 0px 0px 3px #229fc6;
box-shadow: 0px 0px 0px 3px #dadada,
1px 0px 0px 3px #229fc6,
-1px 0px 0px 3px #229fc6;
</code> </code>





و هكذا .....

بـــالتــوفيــــق









©المشاركات المنشورة تعبر عن وجهة نظر صاحبها فقط، ولا تُعبّر بأي شكل من الأشكال عن وجهة نظر إدارة المنتدى©