مرز های گرد در CSS

ویژگی border-radius در CSS برای ایجاد گوشه‌های گرد در عناصر استفاده می‌شود.

با افزایش مقدار border-radius، گوشه‌ها گردتر می‌شوند:

• مرز معمولی
• مرز کمی گرد
• مرز گردتر
• گردترین مرز

مثال: ایجاد گوشه‌های گرد

p {
  border: 2px solid red;
  border-radius: 5px;
}

 نتیجه: عنصر دارای مرز قرمز با ضخامت ۲ پیکسل و گوشه‌های گرد به شعاع ۵ پیکسل خواهد بود.

مثال‌های بیشتر از ویژگی‌های مرز

در ادامه چند مثال از نحوه استفاده از ویژگی‌های مختلف مرز برای طرف‌های خاص آورده شده است:

• تنظیم همه ویژگی‌های مرز بالا در یک خط:

  این مثال نحوه استفاده از ویژگی خلاصه‌شده برای مرز بالا را نشان می‌دهد.

• تنظیم سبک مرز پایین:

  این مثال نحوه تعیین نوع مرز پایین را نمایش می‌دهد.

• تنظیم ضخامت مرز چپ:

  این مثال نحوه تعیین عرض مرز سمت چپ را نشان می‌دهد.

• تنظیم رنگ چهار طرف مرز:

  این مثال نحوه تعیین رنگ مرزها را نمایش می‌دهد. می‌توان از یک تا چهار رنگ مختلف استفاده کرد.

• تنظیم رنگ مرز سمت راست:

  این مثال نحوه تعیین رنگ مرز راست را نشان می‌دهد.

فهرست کامل ویژگی‌های مرز در CSS

 استفاده از این ویژگی‌ها به شما امکان می‌دهد کنترل دقیق و حرفه‌ای بر ظاهر مرزهای عناصر در طراحی صفحات وب داشته باشید.