Thuộc tính font-stretch trong CSS

Thuộc tính font-stretch trong CSS giúp bạn căn chỉnh độ rộng của chữ cái: rộng hơn hay hẹp đi độ rộng chữ cái mặc định của font.

Thuộc tính font-stretch có thể nhận giá trị:

ultra-condensed: các chữ cái của phần tử sẽ được căn chỉnh hẹp nhất có thể.
extra-condensed: các chữ cái của phần tử sẽ được căn chỉnh rộng nhất có thể.
condensed: các chữ cái của phần tử sẽ bị thu hẹp độ rộng. Sự thu hẹp này sẽ nhiều hơn khi được xác định là semi-condensed.
semi-condensed: các chữ cái trong phần tử sẽ được thu hẹp đi một chút, làm cho độ rộng của chúng hơi hẹp hơn độ rộng khi được xác định là normal.
normal: độ rộng của chữ cái ở dạng chuẩn.
semi-expanded: tăng độ rộng của các chữ cái. Với giá trị này, các chữ cái sẽ có độ rộng hơn khi được xác định bởi giá trị normal.
expanded: tăng độ rộng của các chữ cái. Với giá trị này, các chữ cái sẽ có độ rộng hơn khi được xác định bởi giá trị semi-expanded.
extra-expanded: biên độ tăng độ rộng của chữ cái khi được xác định với giá trị này là gần như lớn nhất. Chữ cái sẽ có độ rộng lớn hơn độ rộng khi được xác định bởi expanded.
ultra-expanded: biên độ tăng độ rộng của chữ cái khi được xác định với giá trị này là lớn nhất, rộng hơn khi được xác định bởi giá trị extra-expanded.
wider: độ rộng của chữ cái trong phần tử sẽ rộng hơn độ rộng đã được xác định trong phần tử cha.
narrower: độ rộng của chữ cái trong phần tử sẽ hẹp hơn độ rộng đã được xác định trong phần tử cha.

Thuộc tính font-stretch có thể áp dụng cho:

Tất cả các phần tử HTML.

Cú pháp thuộc tính font-stretch trong DOM

object.style.fontStretch = "expanded";

Quảng cáo

Ví dụ thuộc tính font-stretch trong CSS

Bạn theo dõi ví dụ sau để thấy cách sử dụng của thuộc tính font-stretch trong CSS:

<html>
   <head>
   </head>
   <body>
      <p style="font-stretch:ultra-expanded;">
      Neu gia tri cua thuoc tinh nay khong co hieu qua, tuc la may tinh cua ban 
      <br>khong ho tro hai gia tri: condensed hoac expanded.
      </p>
   </body>
</html>

Kết quả là:

Đã có app VietJack trên điện thoại, giải bài tập SGK, SBT Soạn văn, Văn mẫu, Thi online, Bài giảng....miễn phí. Tải ngay ứng dụng trên Android và iOS.

Theo dõi chúng tôi miễn phí trên mạng xã hội facebook và youtube:

Follow fanpage của team https://www.facebook.com/vietjackteam/ hoặc facebook cá nhân Nguyễn Thanh Tuyền https://www.facebook.com/tuyen.vietjack để tiếp tục theo dõi các loạt bài mới nhất về Java,C,C++,Javascript,HTML,Python,Database,Mobile.... mới nhất của chúng tôi.

Bài học CSS phổ biến khác tại vietjack.com: