Text

CSS3 cung cấp thêm các thuộc tính mới cho định dạng văn bản. Các thuộc tính gồm:

text-overflow
word-wrap
word-break

Trình duyệt hỗ trợ:

	Chrome	IE/Edge	Firefox	Safari	Opera
text-overflow	4.0 +	6.0 +	7.0 +	3.1 +	11.0 + 9.0 -o-
text-wrap	23.0 +	5.5 +	3.5 +	6.1 +	12.1+
word-break	4.0 +	5.5 +	15.0 +	3.1 +	15.0 +

text-overflow

Trong nhiều trường hợp khi nội dung hiển thị có chiều dài vượt quá chiều dài vùng hiển thị, ta gọi trường hợp này là nội dung bị tràn (overflowed content). Thuộc tính text-overflow xác định cách hiển thị những nội dung bị tràn đến người xem.

Thuộc tính text-overflow có 3 giá trị là clip, ellipsis, inherit.

Ví dụ về clip:


p.test1 {

white-space: nowrap;

width: 200px;

border: 1px solid #000000;

overflow: hidden;

text-overflow: clip;

}

<p class="test1">This is some long text that will not fit in the box</p>

Kết quả:

Ví dụ về ellipsis


p.test2 {

white-space: nowrap;

width: 200px;

border: 1px solid #000000;

overflow: hidden;

text-overflow: ellipsis;

}

<p class="test2">This is some long text that will not fit in the box</p>

Kết quả: