آموزش ویژگی text-decoration در CSS

سلام خدمت تمامی دوستان و همراهان محترم سایت آموزشی فری لرن ، امیدوارم که حال همگیتون خوب باشه. لطفا در ادامه با آموزش ویژگی text-decoration در CSS با من همراه باشید.

آموزش ویژگی text-decoration در CSS

Free-Learn

ویژگی text-decoration در CSS

با استفاده از ویژگی text-decoration در CSS میتوان دکوراسیون ( یا تزئین ) یک متن را مشخص و یا تعریف کرد، و بطور کلی تر از این ویژگی برای خلاصه نویسی ویژگی های زیر مورد استفاده قرار میگیرد :

  • text-decoration-line ( ضروری )
  • text-decoration-color
  • text-decoration-style

Free-Learn

مثال از این ویژگی

در ادامه میتوانید یک مثال از ویژگی text-decoration را در زبان CSS مشاهده نمایید.

امتحان کنید

مثال شماره ۲ : حذف خط زیر لینک ( چون بصورت پیش فرض لینک ها زیرشون یک خط صاف کشیده شده )

امتحان کنید

Free-Learn

جدول مشخصات ویژگی text-decoration در CSS

در جدول زیر میتوانید مشخصات کلی این ویژگی را در زبان CSS مشاهده نمایید.

مقدار پیش فرض none CurrentColor solid
قابل ارث بری ندارد | اطلاعات بیشتر
قابل متحرک سازی ندارد | اطلاعات بیشتر
نسخه CSS1 ( تجدید نظر شده در CSS3 )
نحوه استفاده در جاوااسکریپت object.style.textDecoration=”underline”;

Free-Learn

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

در جدول زیر میتوانید مشاهده نمایید که آیا مرورگرهای اینترنتی از ویژگی text-decoration در CSS پشتیبانی میکنند یا خیر.

نام ویژگی Chrome Firefox Opera Safari IE
text-decoration ۱٫۰ ۱٫۰ ۳٫۵ ۱٫۰ خیر

Free-Learn

شکل نوشتاری

نحوه نوشتن یا استفاده یا سینتَکس (Syntax) این ویژگی در CSS بصورت زیر می باشد.

Free-Learn

جدول مقادیر ویژگی text-decoration در CSS

در جدول زیر میتوانید، مقادیری را که میتوان در این ویژگی استفاده کرد مشاهده نمایید.

مقدار توضیح
text-decoration-line نوع خطی که باید به زیر یا بالای متن کشیده شود
( پیش فرض none )
text-decoration-color رنگ خط کشیده شده به زیر یا بالای متن را مشخص میکند
( پیش فرض رنگ متن خوده عنصر )
text-decoration-style استایل یا شکل شمایل خط را مشخص میکند
( پیش فرض solid )
initial استفاده از مقدار پیش فرض یا اولیه | اطلاعات بیشتر
inherit استفاده از مقدار پدر یا والد ( به ارث بری ) | اطلاعات بیشتر

Free-Learn

نکات و توضیحات

  • اگر text-decoration-color را مشخص نکنید بصورت پیش فرض رنگ متن خوده عنصر به عنوان رنگ خط دکوراسیون متن تنظیم میشود.
  • استفاده از text-decoration-line ضروری می باشد، این یعنی اگه از این ویژگی استفاده نکرده باشید در خروجی هیچ خطی به زیر یا بالای متن کشیده نخواهد شد.
  • خلاصه نویسی این ویژگی در مرورگر اینترنت اکسپلورر پشتیبانی نمیشود.

Free-Learn

دریافت PDF یا پرینت این مطلب