کد گرد شدن گوشه تصاویر

با عرض سلام و خسته نباشید ، امروز با یک کد ساده ولی شاید با نمک ! کد خم و گرد شدن گوشه تصاویر سایت و وبلاگ در خدمت شما هستیم.

کد گرد شدن گوشه تصاویر

نیاز هستش که چند تا کد ساده رو به style.css قالبتون اضافه کنید اما نیاز به کمی دقت هستش.ما مثلا می خواهیم که فقط گوشه تصاویر یک قسمت سایت فقط اینطوری گرد باشند شما باید اون “کلاس” مورد نظر رو پیدا کنید تو قالب . مثلا تصاویر یا لوگوهایی که تو کلاس image-radius هستند . بعد شما باید به تصاویر مربوط به این کلاس یک استایل خاص مثلا گرد شدن گوشه تصاویر یا چرخش تصاویر رو با اضافه کردن یک img به اون کلاس اضافه کنید.برای مثال…

.image-radius{
}
.image-radius img{
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-ms-border-radius: 10px;
-o-border-radius: 10px;
}

همونطور که دیدید ما یک کلاس image-radius داشتیم حالا یک img بهش اضافه کردیم و توی اون کدهای مربوط به گرد شدن تصاویر رو قرار دادیم.

نکته : اینجا شعاش گردن شدن روی ۱۰ پیکسل تنظیم شده ، شما در صورت تمایل متناسب با سلیقه خودتون تغییرش بدید.

ساخت آنلاین استایل گرد شدن تصاویر

وب سایت www.border-radius.com این امکان رو برای شما فراهم کرده ، فقط به نکته بالا برای اضافه کردن کدها به محل مورد نظر دقت کنید.

پیش نمایش و دانلود کدها گرد شدن گوشه عکس ها

لینک دانلود

پیش نمایش

همچنین در مطالب قبلی سایت استایل چرخش ۳۶۰ درجه لوگو و تصاویر رو آموزش داده بودیم که با این مطلب تقریبا مشابه هستش ، می تونید از اون هم استفاده کنید.

یا حق