border-radius

از این ویژگی border-radius برای گرد کردن گوشه های یک عنصر استفاده می شود. این ویژگی از نوع ویژگی های مختصر نویسی برای ویژگی های زیر می باشد که هر کدام از آنها مخصوص یک گوشه عنصر هستند: border-top-left-radius border-top-right-radius border-bottom-right-radius border-bottom-left-radius border-radius می تواند یک تا چهار مقدار داشته باشد و اگر مقادیر را […]

border-bottom-right-radius

از ویژگی border-bottom-right-radius برای گرد کردن گوشه پایین و سمت راست یک عنصر استفاده می شود. این ویژگی یک یا دو مقدار می پذیرد که این مقادیر شعاع های یک چهارم شکل بیضویی که نحوه ترسیم لبه بیرونی حاشیه عنصر را تعیین می کند, مشخص می کنند (تصویر زیر بهتر این موضوع را بیان می […]

border-bottom-left-radius

از ویژگی border-bottom-left-radius برای گرد کردن گوشه پایین و سمت چپ یک عنصر استفاده می شود. این ویژگی یک یا دو مقدار می پذیرد که این مقادیر شعاع های یک چهارم شکل بیضویی که نحوه ترسیم لبه بیرونی حاشیه عنصر را تعیین می کند, مشخص می کنند (تصویر زیر بهتر این موضوع را بیان می […]

border-top-right-radius

از ویژگی border-top-right-radius برای گرد کردن گوشه بالا و سمت راست یک عنصر استفاده می شود. این ویژگی یک یا دو مقدار می پذیرد که این مقادیر شعاع های یک چهارم شکل بیضویی که نحوه ترسیم لبه بیرونی حاشیه عنصر را تعیین می کند, مشخص می کنند (تصویر زیر بهتر این موضوع را بیان می […]

border-top-left-radius

از ویژگی border-top-left-radius برای گرد کردن گوشه بالا و سمت چپ یک عنصر استفاده می شود. این ویژگی یک یا دو مقدار می پذیرد که این مقادیر شعاع های یک چهارم شکل بیضویی که نحوه ترسیم لبه بیرونی حاشیه عنصر را تعیین می کند, مشخص می کنند (تصویر زیر بهتر این موضوع را بیان می […]

گرد کردن گوشه های داخلی

گرد کردن گوشه های داخلی

صورت مسئله گاهی نیاز داریم تا نگهدارنده ای مثل شکل زیر داشته باشیم که گوشه هایش از سمت بیرون تیز و از سمت داخل گرد است.     یک راه حل نه چندان جالب استفاده از دو عنصر است که می توان گوش های عنصر داخلی را با border-radius گرد کرد و عنصر بیرونی با […]