თვისება writing-mode

თვისება writing-mode აყენებს ტექსტის ვერტიკალურ ან ჰორიზონტალურ მიმართულებას გვერდზე. მნიშვნელობები შეიძლება იყოს horizontal-tb (ჰორიზონტალურად მარცხნიდან მარჯვნივ და ზემოდან ქვემოთ), vertical-rl (ვერტიკალურად ზემოდან ქვემოთ და მარჯვნიდან მარცხნივ), vertical-lr (ვერტიკალურად ზემოდან ქვემოთ და მარცხნიდან მარჯვნივ).

სინტაქსი

cssსელექტორი {
  writing-mode: horizontal-tb ან vertical-rl ან vertical-lr;
}

მაგალითი

მოდით, დავაყენოთ ჩვენს ტექსტს მიმართულება ჰორიზონტალურად მარცხნიდან მარჯვნივ და ზემოდან ქვემოთ:

html<p>
  ტექსტი
</p>
cssbody {
  width: 100px;
  height: 50px;
}
p {
  writing-mode: horizontal-tb;
  font-size: 2em;
  margin-top: 0;
}

Результат:

მაგალითი

ახლა კი მოდით შევცვალოთ მიმართულება ვერტიკალურად ზემოდან ქვემოთ და მარჯვნიდან მარცხნივ:

html<p>
  ტექსტი
</p>
cssbody {
  width: 100px;
  height: 50px;
}
p {
  writing-mode: vertical-rl;
  font-size: 2em;
  margin-top: 0;
}

Результат:

მაგალითი

მოდით, დავაყენოთ ჩვენს ტექსტს მიმართულება ვერტიკალურად ზემოდან ქვემოთ და მარცხნიდან მარჯვნივ:

html<p>
  ტექსტი
</p>
cssbody {
  width: 100px;
  height: 50px;
}
p {
  writing-mode: vertical-lr;
  font-size: 2em;
  margin-top: 0;
}

Результат:

იხილეთ აგრეთვე

  • თვისება font-kerning,
    რომელიც აყენებს შრიფტის კერნინგს
  • თვისება text-orientation,
    რომელიც აყენებს სიმბოლოების ორიენტაციას ვერტიკალურ ტექსტში