css3 الأطراف الدائرية

http://www.dzbatna.com/images/icons/iconrote.gif css3 ط§ظ„ط£ط·ط±ط§ظپ ط§ظ„ط¯ط§ط¦ط±ظٹط©

---

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

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

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

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

نبدا بسم الله

رمز PHP:

<div class="dzbatna">
dzbatna
div>


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

رمز PHP:

.dzbatna {
background-color: #ccc;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border: 1px solid #000;
padding: 10px;
}


background-color الخلفية

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

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

padding
طول الاطار

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

مثال

http://www.dzbatna.com/attachments/4...63596538-3.png

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

رمز PHP:

.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;
}


مثال

http://www.dzbatna.com/attachments/4...63596538-2.png

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

ألعاب الأندرويد مجانا و حصريا

https://fbcdn-sphotos-d-a.akamaihd.n...93518507_n.png
©المشاركات المنشورة تعبر عن وجهة نظر صاحبها فقط، ولا تُعبّر بأي شكل من الأشكال عن وجهة نظر إدارة المنتدى©