CSS – فاصله‌دهی متن (Text Spacing)

در این بخش با ویژگی‌های زیر برای فاصله‌گذاری متن آشنا می‌شوید:

  • text-indent: تورفتگی خط اول متن
  • letter-spacing: فاصله بین کاراکترها
  • line-height: فاصله بین خطوط
  • word-spacing: فاصله بین کلمات
  • white-space: نحوه مدیریت فضای خالی درون یک عنصر

تورفتگی متن (Text Indentation)

ویژگی text-indent برای مشخص کردن تورفتگی خط اول متن استفاده می‌شود:

p {
  text-indent: 50px;
}

فاصله بین حروف (Letter Spacing)

ویژگی letter-spacing برای مشخص کردن فاصله بین حروف استفاده می‌شود:

h1 {
  letter-spacing: 5px;
}

h2 {
  letter-spacing: -2px;
}

فاصله بین خطوط (Line Height)

ویژگی line-height برای مشخص کردن فاصله بین خطوط استفاده می‌شود:

p.small {
  line-height: 0.8;
}

p.big {
  line-height: 1.8;
}

فاصله بین کلمات (Word Spacing)

ویژگی word-spacing برای تنظیم فاصله بین کلمات استفاده می‌شود:

p.one {
  word-spacing: 10px;
}

p.two {
  word-spacing: -2px;
}

فضای سفید (White Space)

ویژگی white-space نحوه مدیریت فضای خالی درون یک عنصر را مشخص می‌کند. این مثال چگونگی غیرفعال کردن شکستن خطوط را نشان می‌دهد:

p {
  white-space: nowrap;
}

پست های مرتبط

مطالعه این پست ها رو از دست ندین!
JavaScript - تاریخ‌ها (Dates)

JavaScript – تاریخ‌ها (Dates)

آبجکت‌های تاریخ (Date) در جاوااسکریپت آبجکت‌های تاریخ در جاوااسکریپت به ما امکان کار با تاریخ و زمان را می‌دهند....

بیشتر بخوانید
JavaScript - آرایه‌های ثابت (Array Const)

JavaScript – آرایه‌های ثابت (Array Const)

جاوااسکریپت: تعریف آرایه با const در سال 2015، جاوااسکریپت کلمه کلیدی مهمی به نام const را معرفی کرد. این...

بیشتر بخوانید
JavaScript - تکرار آرایه‌ها (Array Iteration)

JavaScript – تکرار آرایه‌ها (Array Iteration)

جاوا اسکریپت: تکرار بر روی آرایه‌ها جاوا اسکریپت روش‌های مختلفی برای تکرار (Iteration) بر روی آرایه‌ها ارائه می‌دهد که...

بیشتر بخوانید

نظرات

سوالات و نظراتتون رو با ما به اشتراک بذارید

برای ارسال نظر لطفا ابتدا وارد حساب کاربری خود شوید.