font-feature-settings

Cú pháp

/* Sử dụng cài đặt mặc định */
font-feature-settings: normal;

/* Đặt giá trị cho các tag tính năng OpenType */
font-feature-settings: "smcp";
font-feature-settings: "smcp" on;
font-feature-settings: "swsh" 2;

Giá trị

Descriptor này được chỉ định là từ khóa normal hoặc là một danh sách phân cách bằng dấu phẩy của các giá trị <feature-tag-value>. Khi kết xuất văn bản, danh sách các giá trị OpenType <feature-tag-value> được chuyển đến engine bố cục văn bản để bật hoặc tắt các tính năng font.

normal

Chỉ ra rằng văn bản được bố cục bằng cài đặt font mặc định. Đây là giá trị mặc định.

<feature-tag-value>

Đại diện cho một tuple phân cách bằng khoảng trắng bao gồm tên tag và một giá trị tùy chọn.

Tên tag luôn là <string> gồm bốn ký tự ASCII. Nếu tên tag có nhiều hơn hoặc ít hơn bốn ký tự hoặc nếu nó chứa các ký tự nằm ngoài phạm vi điểm code U+20 – U+7E, descriptor là không hợp lệ.

Giá trị tùy chọn có thể là một số nguyên dương hoặc từ khóa on hoặc off. Các từ khóa on và off là từ đồng nghĩa với các giá trị 1 và 0 tương ứng. Nếu không có giá trị nào được đặt, mặc định là 1. Đối với các tính năng OpenType không phải boolean (ví dụ: các lựa chọn thay thế theo phong cách), giá trị ngụ ý một glyph cụ thể sẽ được chọn; đối với các tính năng boolean, giá trị bật hoặc tắt tính năng.

Định nghĩa hình thức

Cú pháp hình thức

font-feature-settings = 
  normal                |
  <feature-tag-value>#  

<feature-tag-value> = 
  <opentype-tag> [ <integer [0,∞]> | on | off ]?  

<opentype-tag> = 
  <string>  

<integer> = 
  <number-token>  

Ví dụ

Bật các glyph swash bằng at-rule @font-face

Trong ví dụ này, tên tag swsh và giá trị boolean 1 được sử dụng làm giá trị cho descriptor font-feature-settings trong at-rule @font-face.

HTML

<p class="swash-off">Swash is off here</p>
<p class="swash-on">Swash is on here</p>

CSS

@font-face {
  font-family: "MonteCarlo";
  src: url("/shared-assets/fonts/monte-carlo/monte-carlo-regular.woff2");
}
@font-face {
  font-family: "MonteCarlo2";
  src: url("/shared-assets/fonts/monte-carlo/monte-carlo-regular.woff2");
  font-feature-settings: "swsh" 1;
}
p {
  font-size: 3rem;
  margin: 0.7rem 3rem;
}
.swash-off {
  font-family: "MonteCarlo", cursive;
}
.swash-on {
  font-family: "MonteCarlo2", cursive;
}

Kết quả

Dòng 1 hiển thị thiết kế trang trí mặc định của font MonteCarlo, và dòng 2 hiển thị các glyph mặc định được thay thế bằng các glyph swash.

Thông số kỹ thuật

Khả năng tương thích với trình duyệt

Xem thêm

• Các descriptor @font-face khác: font-family, font-style, font-variation-settings, font-weight, src
• Các thuộc tính font liên quan: font-feature-settings, font-variant-alternates, font-variation-settings