الحواف المستديرة للصور بدون برامج !


السلام عليكم ورحمة الله
معنا اليوم اضافة جميلة لتدوير حواف الصور بتقنية  css من موقع : roundpic

وطريقة الاستخدام سهلة وبسيطة  فقط ارفع الصورة من جهازك أو ضع رابط الصورة المراد تدوير حوافها ثم اضغط على زر generate rounded image







Round Your Image Corners Now!




Image:
or URL:




This widget is a coutesy of roundpic.



كود الاضافة يمكن طبعه داخل أداة   html   أو داخل التدوينة بعد الانتقال الى وضع تحرير  html





<h3>Round Your Image Corners Now!</h3>  <p><em></em></p> <style>





input {
color:#289728;
font: normal 14px  arial, sans-serif, verdana;
border:1px dotted #67a7e3; 
background:#fff; padding:4px 2px;
}

input:hover {
border:1px solid #67a7e3;
} </style><form enctype="multipart/form-data" method="post" action="http://www.roundpic.com"><input name="MAX_FILE_SIZE" type="hidden">     <br>    <table><tbody>       <tr>         <td class="title"><b>Image:</b></td>          <td><input style="border-width: 1px; border-style: dotted; border-color: rgb(0, 128, 255); padding: 4px 2px; margin-right: 0px;" name="file" type="file"></td>       </tr>        <tr>         <td class="title">or <b>URL:</b></td>          <td class="input"><input name="url"></td>       </tr>        <tr>         <td class="submit" colspan="2"><button onclick="getLoader();" type="submit">Generate Rounded Image!</button></td>       </tr>     </tbody></table> </form>  <p><em></em></p>  <p><em></em></p>  <p><em></em></p>  <p><em>     </em></p><hr><em>This widget is a coutesy of </em><a href="http://roundpic.com" target="_blank"><em>roundpic</em></a>.



والى هنا ينتهي الموضوع دمتم بود و في أمان الله

إشترك لتحصل على جديد المواضيع

مدون عربي مهتم بالتقنية الحديثة وتطوير الويب مهتم بشكل خاص بمنصة بلوجر واجيد الى حد ما التعامل مع css.html.jquery

تصميم وتطوير: يوسف بجاد