css3 ط§ظ„ط£ط·ط±ط§ظپ ط§ظ„ط¯ط§ط¦ط±ظٹط©


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

درس مفصل اليوم هو انشاء الاطراف الدائرية عن طريق css 3

مع تقنية css3 سهلة اشياء كثير جدا

دعم css3 في المتصفحات مازال محدود

نبدا بسم الله




رمز PHP:
<code style="white-space:nowrap"> <code> <div class="dzbatna">
dzbatna
</div>
</code> </code>




سيكون الcss بالشكل التالي

رمز PHP:
<code style="white-space:nowrap"> <code> .dzbatna {
background-color: #ccc;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border: 1px solid #000;
padding: 10px;
}
</code> </code>





background-color الخلفية

moz-border-radius
webkit-border-radius
القيمة ٥ هي مستوى الانحناء في الزاوية

border
حجم الاطار الخارجي و لون الاطار

padding
طول الاطار

كما يمكننا الحصول على استدارة لزوايا معينة

مثال


سيكون الcss بالشكل التالي

رمز PHP:
<code style="white-space:nowrap"> <code> .dzbatna{
background-color: #ccc;
-moz-border-radius-topleft: 5px;
-moz-border-radius-topright: 0px;
-moz-border-radius-bottomright: 5px;
-moz-border-radius-bottomleft: 0px;
-webkit-border-top-left-radius: 5px;
-webkit-border-top-right-radius: 0px;
-webkit-border-bottom-left-radius: 0px;
-webkit-border-bottom-right-radius: 5px;
border: 1px solid #000;
padding: 10px;
}
</code> </code>


مثال






التعديل الأخير كان بواسطة Designer different; 16 - 01 - 2014 الساعة 02:10





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