آموزش فاصله گذاریِ متن در CSS

در این فصل، قصد داریم در مورد ویژگی های زیر در CSS بحث کنیم:

1. text-indent
2. letter-spacing
3. line-height
4. word-spacing
5. white-space

تو رفتگی متن در CSS

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

p {
  text-indent: 50px;
}

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

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

h1 {
  letter-spacing: 5px;
}

h2 {
  letter-spacing: -2px;
}

ارتفاع خط(Line Height) در CSS

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

p.small {
  line-height: 0.8;
}

p.big {
  line-height: 1.8;
}

فاصله ی بین حروف(Word Spacing) در CSS

از ویژگی word-spacing برای مشخص کردن فاصله ی بین کلمات در یک متن استفاده می شود. مثال زیر نشان می دهد که چگونه فاصله ی بین کلمات را کاهش یا افزایش دهیم:

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

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

فاصله ی سفید

ویژگی white-space مشخص می کند که فاصله ی سفید درون یک عنصر چگونه باید به کار برده شود. در مثال زیر، یک خط وجود دارد که شکسته نمی شود:

p {
  white-space: nowrap;
}

ویژگی های فاصله گذاری در CSS