آموزش ویژگی text-decoration در CSS | آموزش کامل + نمونه کد

قبلی بعدی

ویژگی text-decoration در CSS

ویژگی text-decoration می تواند ظاهر متن را با خط تغییر دهد.

ویژگی های تغییر ظاهر متن با خط شامل:

ویژگی text-decoration-line، محل خط را مشخص می کند. مقادیر این ویژگی شامل:

text-decoration-line: overline;

ویژگی text-decoration-color، رنگ خط را مشخص می کند. مقادیر این ویژگی شامل:

text-decoration-color: red;

نکته: برای آشنایی بیشتر با رنگ ها، به درس رنگ ها در CSS مراجعه کنید.

ویژگی text-decoration-style، سبک خط را مشخص می کند. این ویژگی مقادیر زیر را می پذیرد.

مقادیر	توضیحات
dotted	یک خط را به صورت نقطه چین تعریف می کند.
dashed	یک خط را به صورت خط چین تعریف می کند.
solid	یک خط ساده را می سازد.
double	یک خط دوتایی را تعریف می کند.
wavy	یک خط موج دار را می سازد.

text-decoration-style: solid;

ویژگی text-decoration-thickness، ضخامت خط را مشخص می کند.

text-decoration-thickness: 5px;

text-decoration-line: overline;
text-decoration-color: red;
text-decoration-style: solid;
text-decoration-thickness: 5px;

برای خلاصه کردن چهار ویژگی بالا در یک ویژگی، می توانیم از ویژگی text-decoration استفاده کنیم.

text-decoration : td-line td-color td-style td-thickness;

text-decoration: underline red double 5px;

مقادیر	توضیحات
text-decoration	خلاصه نویسی ویژگی های text-decoration
text-decoration-line	تنظیم محل خط روی متن
text-decoration-color	تنظیم رنگ خط روی متن
text-decoration-style	تنظیم سبک خط روی متن
text-decoration-thickness	تنظیم ضخامت خط روی متن

در این درس با ویژگی های text-decoration در CSS:

آشنا شدیم.

قبلی بعدی

توسعه دهندگان

احسان اسلامی