CSS3: CSS: word-spacing


Khóa học qua video:
Lập trình Python All Lập trình C# All SQL Server All Lập trình C All Java PHP HTML5-CSS3-JavaScript
Đăng ký Hội viên
Tất cả các video dành cho hội viên

Thuộc tính CSS word-spacing dùng để thiết lập khoảng cách giữa các từ và giữa các thẻ.

Cú pháp

/* Keyword value */
word-spacing: normal;

/* <length> values */
word-spacing: 3px;
word-spacing: 0.3em;

/* <percentage> values */
word-spacing: 50%;
word-spacing: 200%;

/* Global values */
word-spacing: inherit;
word-spacing: initial;
word-spacing: unset;

Giá trị

normal

Khoảng cách giữa các từ thông thường, như được xác định bởi phông chữ hiện tại và/hoặc trình duyệt.

<length>

Chỉ định khoảng cách bổ sung ngoài khoảng cách giữa các từ nội tại được xác định bởi phông chữ.

<percentage>

Chỉ định khoảng cách thêm dưới dạng phần trăm chiều rộng trước của ký tự bị ảnh hưởng.

Cú pháp chính thức

normal | <length-percentage>

trong đó,
<length-percentage> = <length> | <percentage>

Ví dụ

HTML

<div id="mozdiv1">Here are many words...</div>
<div id="mozdiv2">...and many more!</div>

CSS

#mozdiv1 {
  word-spacing: 15px;
}

#mozdiv2 {
  word-spacing: 5em;
}

Quan tâm

Một giá trị word-spacing dương hoặc âm lớn sẽ làm cho các từ mà kiểu được áp dụng thành không thể đọc được. Đối với văn bản được tạo kiểu có giá trị dương rất lớn, các từ sẽ cách xa nhau đến mức nó sẽ không còn dạng là một câu nữa. Đối với văn bản được tạo kiểu có giá trị âm lớn, các từ sẽ chồng chéo lên nhau đến điểm bắt đầu và kết thúc của mỗi từ không thể nhận ra.

Dễ đọc word-spacing phải được xác định trên cơ sở từng trường hợp, vì các họ phông chữ khác nhau có độ rộng ký tự khác nhau. Không có một giá trị nào có thể đảm bảo tất cả các họ phông chữ tự động duy trì mức độ dễ đọc.

» Tiếp: white-space
« Trước: CSS: word-break
Khóa học qua video:
Lập trình Python All Lập trình C# All SQL Server All Lập trình C All Java PHP HTML5-CSS3-JavaScript
Đăng ký Hội viên
Tất cả các video dành cho hội viên
Copied !!!