Bạn có thể đặt các biểu tượng ở bất kỳ đâu bằng cách sử dụng Tiền tố CSS fa
và tên của biểu tượng. Các biểu tượng được thiết kế để sử dụng với các thành phần nội tuyến [chúng tôi thích thẻ vì sự ngắn gọn, nhưng sử dụng
thì đúng ngữ nghĩa hơn]
Để tăng kích thước biểu tượng so với vùng chứa của chúng, hãy sử dụng fa-xs
, fa-sm
, fa-lg
[tăng 33%] hoặc sử dụng kích thước chữ [để chia tỷ lệ từ 1x thành 10x]
Bạn có thể làm cho tất cả các biểu tượng của mình có cùng chiều rộng để chúng có thể dễ dàng căn chỉnh theo chiều dọc, chẳng hạn như trong danh sách hoặc menu điều hướng
Thêm một lớp
8 trên phần tử HTML tham chiếu biểu tượng của bạn để đặt một hoặc nhiều biểu tượng có cùng chiều rộng cố định. Điều này thật tuyệt khi sử dụng khi thay đổi độ rộng của biểu tượng [e. g. một biểu tượng cao nhưng gầy phía trên một biểu tượng rộng nhưng ngắn] sẽ làm mất căn chỉnh theo chiều dọc. Để rõ ràng trong ví dụ sau, chúng tôi đã thêm màu nền trên biểu tượng để bạn có thể thấy chiều rộng cố định và cũng tăng kích thước phông chữ của phần tử gốc Bootstrap 4 không có thư viện biểu tượng riêng [Glyphicons từ Bootstrap 3 không được hỗ trợ trong BS4]. Tuy nhiên, có rất nhiều thư viện biểu tượng miễn phí để lựa chọn, chẳng hạn như Font Awesome và Google Material Design Icons
Để sử dụng các biểu tượng Phông chữ tuyệt vời, hãy thêm phần sau vào trang HTML của bạn [Không cần tải xuống hoặc cài đặt]
Sau đó, thêm tên của lớp biểu tượng vào bất kỳ phần tử HTML nội tuyến nào [chẳng hạn như hoặc
]
Thí dụ
Dưới đây là danh sách tất cả Bootstrap 3 Glyphicons
Ghi chú. Glyphicons không được hỗ trợ trong Bootstrap 4
IconDescriptionExampleglyphicon glyphicon-asteriskTry itglyphicon glyphicon-plusTry itglyphicon glyphicon-minusTry itglyphicon glyphicon-eurTry itglyphicon glyphicon-euroTry itglyphicon glyphicon-cloudTry itglyphicon glyphicon-envelopeTry itglyphicon glyphicon-pencilTry itglyphicon glyphicon-glassTry itglyphicon glyphicon-musicTry itglyphicon glyphicon-searchTry itglyphicon glyphicon-heartTry itglyphicon glyphicon