گرد کردن
پرش به ناوبری
پرش به جستجو
ویژگی border-radius برای اضافه‌کردن کادرهایی با گوشه گِرد به یک عنصر استفاده می‌شود:[۱]
نکته: ویژگی border-radius در نسخه IE8 و نسخه‌های قدیمی‌تر پشتیبانی نمی‌شود.
مثال‌های بیشتر
تعریف تمامی ویژگی‌های کادر بالا در یک تعریف
این مثال نحوه استفاده از ویژگی مختصر را برای تنظیم تمامی ویژگی‌های کادر بالا در یک اعلان نشان می‌دهد.
این مثال نحوه تنظیم استایل کادر پایین را نشان می‌دهد.
این مثال نحوه تنظیم عرض کادر سمت چپ را نشان می‌دهد.
این مثال نحوه تنظیم رنگ چهار کادر را نشان می‌دهد. کادر می‌تواند یک تا چهار رنگ داشته باشد.
این مثال نحوه تنظیم رنگ کادر سمت راست را نشان می‌دهد.
خودتان را با تمرین‌ها آزمایش کنید!
تمامی ویژگی‌های کادر در CSS
| ویژگی | توضیحات |
|---|---|
| border | تمامی ویژگی‌های کادر را در یک تعریف تنظیم می‌کند |
| border-bottom | تمامی ویژگی‌های کادر پایینی را در یک اعلان تنظیم می‌کند |
| border-bottom-color | رنگ کادر پایینی را مشخص می‌کند |
| border-bottom-style | استایل کادر پایینی را تنظیم می‌کند |
| border-bottom-width | عرض کادر پایینی را مشخص می‌کند |
| border-color | رنگ چهار ضلع کادر را تنظیم می‌کند |
| border-left | تمامی ویژگی‌های کادر سمت چپ را در یک اعلان مشخص می‌کند |
| border-left-color | رنگ کادر سمت چپ را مشخص می‌کند |
| border-left-style | استایل کادر سمت چپ را مشخص می‌کند |
| border-left-width | عرض کادر سمت چپ را مشخص می‌کند |
| border-radius | تمامی چهار ویژگی border-radius را برای گوشه‌های گرد شده تنظیم می‌کند |
| border-right | تمامی ویژگی‌های کادر سمت راست را در یک تعریف تنظیم می‌کند |
| border-right-color | رنگ کادر سمت راست را تنظیم می‌کند |
| border-right-style | استایل کادر سمت راست را تنظیم می‌کند |
| border-right-width | عرض کادر سمت راست را تنظیم می‌کند |
| border-style | استایل چهار ضلع کادر را تنظیم می‌کند |
| border-top | تمامی ویژگی‌های کادر بالایی را در یک تعریف مشخص می‌کند |
| border-top-color | رنگ کادر بالا را تنظیم می‌کند |
| border-top-style | استایل کادر بالا را تنظیم می‌کند |
| border-top-width | عرض کادر بالا را مشخص می‌کند |
| border-width | عرض چهار ضلع کادر را مشخص می‌کند |
منابع آموزشی