ویژگی text-decoration-thickness CSS

توصیه‌های دوره:

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

ویژگی text-decoration-thickness تعیین می‌کند که ضخامت خط تزئین چگونه باشد.

لطفاً به: مراجعه کنیددستورالعمل‌های CSS:

ویژگی text-decorationمتن CSS

آموزش CSS:

مثال

برای تنظیم خطوط تزئین با ضخامت مختلف برای عناصر <h1>، <h2>، <h3>، <h4> استفاده کنید:
  text-decoration: underline;
  text-decoration-thickness: auto;
}
h2 {
  text-decoration: underline;
  text-decoration-thickness: 5px;
}
h3 {
  text-decoration: underline;
  text-decoration-thickness: 50%;
}
/* استفاده از ویژگی‌های خلاصه */
h4 {
  text-decoration: underline solid red 50%;
}

آزمایش کنید

قوانین CSS

text-decoration-thickness: auto|from-font|length/percentage|initial|inherit;

مقدار ویژگی

مقدار توضیح
auto مرورگر ضخامت خط تزئین را انتخاب می‌کند.
from-font اگر فایل فونت شامل اطلاعات مربوط به ضخامت خط پیش‌فرض دارد، از این مقدار استفاده کنید. اگر نه، به صورت auto نمایش داده می‌شود.
length/percentage ضخامت خط را به عنوان مقدار طول یا درصد تعیین کنید.
initial این ویژگی را به مقدار پیش‌فرض خود تنظیم کنید. لطفاً به: مراجعه کنید initial.
inherit این ویژگی را از عنصر والد خود ارث می‌برد. لطفاً به: مراجعه کنید inherit.

جزئیات فنی

مقدار پیش‌فرض: auto
ارث‌برداری: خیر
انیمیشن‌سازی: پشتیبانی نمی‌شود. لطفاً به: مراجعه کنیدویژگی‌های مرتبط با انیمیشن.
نسخه: CSS4
قوانین جاوااسکریپت: object.style.textDecorationThickness="5px"

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

اعداد در جدول نشان‌دهنده نسخه مرورگر اولیه‌ای است که این ویژگی را کاملاً پشتیبانی می‌کند.

Chrome IE / Edge Firefox Safari Opera
89.0 89.0 70.0 12.1 75.0