هذا كود بسيط مكون من css لتصميم مربعات و سبانات و ديفجنات ناعمة الحواف بدن اي استخدام للصور


كود بلغة HTML:
كود PHP:
<style> .roundDiv1 background:#BB0000; color:#fff; margin:0 8px; font-family:verdana,arial;font-size:9pt; font-weight:bolder;text-align:center;width:450px; } .rtop, .rbottom { display:block; background:#fff; } .rtop *, .rbottom * { display: block; height: 1px; overflow: hidden; background:#BB0000; } .r1{margin: 0 5px} .r2{margin: 0 3px} .r3{margin: 0 2px} .r4{ margin: 0 1px; height: 2px } </style> 


الأن نأتي الى طريقة الإستخدام

سوف استخدم هذا الكلاس لنشاء 4 حواف ناعمة



والاستخدام كالتالي :

كود بلغة HTML:
كود PHP:
<div class=”roundDiv1″
وهذا جاهز كامل :

كود بلغة HTML:
كود PHP:
<div class=”roundDiv1″> <class=”rtop”><class=”r1″></b> <class=”r2″></b> <class=”r3″> </b> <class=”r4″></b></b>4 حواف ناعمة<class=”rbottom”><class=”r4″></b> <class=”r3″></b> <class=”r2″></b> <class=”r1″></b></b
</div>


وسوف استخدم الكلاس لحافتين ناعمتني فقط وهما العلويتان



وهذا واحد جاهز :

كود بلغة HTML:
كود PHP:
<div class=”roundDiv1″> <class=”rtop”><class=”r1″></b> <class=”r2″></b> <class=”r3″> </b> <class=”r4″></b></bDIV حافتان ناعمتان فقط