Thuộc tính text-align-last

Thuộc tính text-align-last thiết lập sự căn chỉnh cho dòng cuối cùng của văn bản: theo lề trái, theo lề phải, ở giữa, hoặc căn đều cả hai lề trái và phải cùng một lúc.

Hãy lưu ý rằng nếu trong phần tử (ví dụ, trong đoạn văn), chỉ có một dòng - thì dòng đó được coi là dòng đầu tiên và cũng là dòng cuối cùng và sự căn chỉnh của nó sẽ được thiết lập như trong text-align-last, chứ không phải trong text-align.

Cú pháp

cssbộ chọn {
  text-align-last: center | left | right | justify | auto | start | end;
}

Giá trị

Giá trị	Mô tả
`center`	Căn giữa.
`left`	Căn lề trái.
`right`	Căn lề phải.
`justify`	Căn đều cả hai lề trái và phải.
`auto`	Không thay đổi căn chỉnh của phần tử.
`start`	Bằng `left` nếu văn bản đi từ trái sang phải và bằng `right`, khi văn bản đi từ phải sang trái (tiếng Ả Rập, v.v.).
`end`	Bằng `right` nếu văn bản đi từ trái sang phải và bằng `left`, khi văn bản đi từ phải sang trái.
`inherit`	Kế thừa giá trị từ phần tử cha.

Giá trị mặc định: auto.

Ví dụ . Giá trị left

html<p>
  Lorem ipsum dolor sit amet, consectetur adipiscing elitorire
  aenean a dapibus magna, ac interdum nisl. Suspendisse egetil
  fringilla nibh, eu commodo arcu. Donec lacinia tempor velite
  sed tincidunt. Aliquam porttitor nulla purus, vel vulputater
  ipsum faucibus sed. Phasellus sodales, lorem vel cursus vehi
  ante purus lacini dui, interdum fringilla massa eros ut duir.
</p>
<p>
  Lorem ipsum dolor sit amet.
</p>

cssp {
  text-align: justify;
  text-align-last: left;
}

Результат:

Ví dụ . Giá trị right

html<p>
  Lorem ipsum dolor sit amet, consectetur adipiscing elitorire
  aenean a dapibus magna, ac interdum nisl. Suspendisse egetil
  fringilla nibh, eu commodo arcu. Donec lacinia tempor velite
  sed tincidunt. Aliquam porttitor nulla purus, vel vulputater
  ipsum faucibus sed. Phasellus sodales, lorem vel cursus vehi
  ante purus lacini dui, interdum fringilla massa eros ut duir.
</p>
<p>
  Lorem ipsum dolor sit amet.
</p>

cssp {
  text-align: justify;
  text-align-last: right;
}

Результат:

Ví dụ . Giá trị center

html<p>
  Lorem ipsum dolor sit amet, consectetur adipiscing elitorire
  aenean a dapibus magna, ac interdum nisl. Suspendisse egetil
  fringilla nibh, eu commodo arcu. Donec lacinia tempor velite
  sed tincidunt. Aliquam porttitor nulla purus, vel vulputater
  ipsum faucibus sed. Phasellus sodales, lorem vel cursus vehi
  ante purus lacini dui, interdum fringilla massa eros ut duir.
</p>
<p>
  Lorem ipsum dolor sit amet.
</p>

cssp {
  text-align: justify;
  text-align-last: center;
}

Результат:

Ví dụ . Giá trị justify

html<p>
  Lorem ipsum dolor sit amet, consectetur adipiscing elitorire
  aenean a dapibus magna, ac interdum nisl. Suspendisse egetil
  fringilla nibh, eu commodo arcu. Donec lacinia tempor velite
  sed tincidunt. Aliquam porttitor nulla purus, vel vulputater
  ipsum faucibus sed. Phasellus sodales, lorem vel cursus vehi
  ante purus lacini dui, interdum fringilla massa eros ut duir.
</p>
<p>
  Lorem ipsum dolor sit amet.
</p>

cssp {
  text-align: justify;
  text-align-last: justify;
}

Результат: