دکوراسیون متن در سی اس اس CSS textDecoration سوپر دوره CSS جلسه 24

Опубликовано: 11 Июль 2026
на канале: مجتبی صمدی

همه چیز درباره Text Decoration در CSS

ویژگی Text Decoration در CSS به شما امکان می‌دهد تا جلوه‌های بصری مختلفی را به متن اضافه کنید. این ویژگی به شما اجازه می‌دهد تا خطوطی مانند زیرخط (underline)، روی خط (overline)، خط میانی (line-through) و دیگر جلوه‌ها را به متن‌های خود اضافه کنید. در این مقاله، به بررسی جامع ویژگی‌های Text Decoration در CSS می‌پردازیم.

#### ویژگی‌های Text Decoration

1. **text-decoration-line**: نوع خطی که به متن اضافه می‌شود را مشخص می‌کند. مقادیر این ویژگی شامل:
`underline` (زیرخط): یک خط زیر متن اضافه می‌کند.
`overline` (روی خط): یک خط بالای متن اضافه می‌کند.
`line-through` (خط میانی): یک خط وسط متن اضافه می‌کند.
`none` (بدون خط): هیچ خطی به متن اضافه نمی‌شود (حذف خطوط موجود).

2. **text-decoration-color**: رنگ خط تزئینی را تعیین می‌کند. می‌توانید از نام‌های رنگ، کدهای هگزادسیمال، یا مقادیر RGB و HSL استفاده کنید.

3. **text-decoration-style**: سبک خط تزئینی را مشخص می‌کند. مقادیر این ویژگی شامل:
`solid` (پیوسته): خط پیوسته
`double` (دوبل): خط دوبل
`dotted` (نقطه‌دار): خط نقطه‌دار
`dashed` (چین‌دار): خط چین‌دار
`wavy` (موج‌دار): خط موج‌دار

4. **text-decoration-thickness**: ضخامت خط تزئینی را تعیین می‌کند. این ویژگی می‌تواند مقادیر مختلفی مانند نازک، متوسط، ضخیم یا واحدهای اندازه‌گیری مانند پیکسل و ام باشد.

#### ترکیب ویژگی‌های Text Decoration

می‌توانید ویژگی‌های مختلف Text Decoration را به صورت ترکیبی در یک خط تعریف کنید. این ویژگی به شما اجازه می‌دهد تا خطوط تزئینی دلخواه خود را به راحتی و با یک دستور اعمال کنید.

#### مثال‌های کاربردی:

**زیرخط برای لینک‌ها**: معمولاً لینک‌ها به صورت پیش‌فرض زیرخط دارند تا از متن عادی متمایز شوند.
**خط میانی برای متن‌های حذف‌شده**: در متن‌هایی که باید به کاربر نشان داده شود که قسمتی از متن حذف شده است، از خط میانی استفاده می‌شود.
**تزئینات متن خاص**: می‌توانید برای تاکید بیشتر روی قسمت‌های خاصی از متن، از ترکیب خطوط تزئینی با رنگ و سبک‌های مختلف استفاده کنید.

#### نکات پایانی

استفاده از Text Decoration می‌تواند به بهبود خوانایی و تاکید بر روی قسمت‌های خاصی از متن کمک کند.
همیشه به زیبایی و خوانایی توجه کنید و از تزئینات اضافی پرهیز کنید تا متن شما زیبا و خوانا باقی بماند.

با توجه به این نکات و تکنیک‌ها، می‌توانید از ویژگی Text Decoration در CSS به بهترین نحو استفاده کنید تا وبسایت‌هایی با طراحی بهتر و جذاب‌تر ایجاد کنید.

آدرس سایت و شبکه های اجتماعی ما :
https://samadikala.ir
https://www.aparat.com/samadikala.ir
/ sherlock021holmes