ویژگی Style borderStyle

تعریف و استفاده

borderStyle ویژگی تنظیم یا بازگرداندن سبک لبه‌های عنصر.

این ویژگی می‌تواند یک تا چهار مقدار را بپذیرد:

  • یک مقدار، به عنوان مثال: p {border-style: solid} - همه چهار لبه به صورت جامد هستند
  • دو مقدار، به عنوان مثال: p {border-style: solid dotted} - لبه‌های بالا و پایین به خط چین، لبه‌های چپ و راست به خط پرده
  • سه مقدار، به عنوان مثال: p {border-style: solid dotted double} - لبه بالا به خط چین، لبه‌های چپ و راست به خط نقطه‌ای، لبه پایین به خط دوگانه
  • چهار مقدار، به عنوان مثال: p {border-style: solid dotted double dashed} - لبه بالا به خط چین، لبه راست به خط پرده، لبه پایین به خط دوگانه، لبه چپ به خط پرده

لطفاً به:

آموزش CSS:حلقه CSS

دستورالعمل CSS:ویژگی border-style

دستورالعمل DOM HTML:ویژگی border

مثال

مثال 1

لبه‌های جامد به عناصر <div> اضافه کنید:

document.getElementById("myDiv").style.borderStyle = "solid";

آزمایش کنید

مثال 2

طراحی لبه‌های چهارگانه <div> را تغییر دهید:

document.getElementById("myDiv").style.borderStyle = "dotted solid double dashed";

آزمایش کنید

مثال 3

مقدار لبه‌های <div> را بازگرداند:

alert(document.getElementById("myDiv").style.borderStyle);

آزمایش کنید

مثال 4

نمایش تمامی مقادیر مختلف:

var listValue = selectTag.options[selectTag.selectedIndex].text;
document.getElementById("myDiv").style.borderStyle = listValue;

آزمایش کنید

نحوه نوشتن

ویژگی borderStyle را بازگردانید:

object.style.borderStyle

ویژگی borderStyle را تنظیم کنید:

object.style.borderStyle = value
مقدار توضیح
none لبه‌های بدون لبه را تعریف می‌کند. پیش‌فرض.
hidden با "none" مشابه است، اما در حل اختلافات لبه‌های عناصر جدول، استثنا دارد.
dotted لبه‌های نقطه‌ای را تعریف می‌کند.
dashed لبه‌های خطی را تعریف می‌کند.
solid لبه‌های جامد را تعریف می‌کند.
double دو لبه را تعریف می‌کند. عرض هر دو لبه با مقدار border-width مشابه است.
groove لبه‌های groove 3D را تعریف می‌کند. اثر آن بستگی به border-color دارد.
ridge لبه‌های ridge 3D را تعریف می‌کند. اثر آن بستگی به border-color دارد.
inset لبه‌های inset 3D را تعریف می‌کند. اثر آن بستگی به border-color دارد.
مقدار لبه‌های outset 3D را تعریف می‌کند. اثر آن بستگی به مقدار border-color دارد.
initial این ویژگی را به مقدار پیش‌فرض خود تنظیم کنید. لطفاً به initial.
inherit این ویژگی را از عنصر والد خود ارث می‌برد. لطفاً به inherit.

جزئیات فنی

مقدار پیش‌فرض: هیچ
مقدار بازگشتی: زنجیره ای است که سبک لبه‌های عنصر را نشان می‌دهد.
نسخه CSS: CSS1

پشتیبانی مرورگر

کروم ایج فایرفاکس Safari Opera
کروم ایج فایرفاکس Safari Opera
پشتیبانی پشتیبانی پشتیبانی پشتیبانی پشتیبانی