Thành phần Bootstrap

Chương này giải thích cách sử dụng Bootstrap Glyphicons (Thành phần). Giả sửcustom là tên lớp CSS mà chúng tôi đã xác định kích thước và màu sắc, như được hiển thị trong ví dụ dưới đây.

<html>
   <head>
      <link rel = "stylesheet" href = "https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
      
      <i.custom {font-size: 2em; color: blue;}>
   </head>
	
   <body>
      <i class = "glyphicon glyphicon-tree-deciduous custom"></i>
   </body>
	
</html>

Bảng sau đây chứa cách sử dụng và kết quả của Bootstrap Glyphicons (Thành phần). Thay thế thẻ <body> của chương trình trên bằng mã được đưa ra trong bảng để nhận kết quả đầu ra tương ứng -

Sử dụng	Kết quả
<i class = "glyphicon glyphicon-asterisk custom"> </i>
<i class = "glyphicon glyphicon-plus custom"> </i>
<i class = "glyphicon glyphicon-euro custom"> </i>
<i class = "glyphicon glyphicon-trừ tùy chỉnh"> </i>
<i class = "glyphicon glyphicon-cloud custom"> </i>
<i class = "glyphicon glyphicon-phong bì tùy chỉnh"> </i>
<i class = "glyphicon glyphicon-pencil custom"> </i>
<i class = "glyphicon glyphicon-glass custom"> </i>
<i class = "glyphicon glyphicon-music custom"> </i>
<i class = "glyphicon glyphicon-search custom"> </i>
<i class = "glyphicon glyphicon-tim tùy chỉnh"> </i>
<i class = "glyphicon glyphicon-star custom"> </i>
<i class = "glyphicon glyphicon-star-blank custom"> </i>
<i class = "glyphicon glyphicon-user custom"> </i>
<i class = "glyphicon glyphicon-film custom"> </i>
<i class = "glyphicon glyphicon-th-large custom"> </i>
<i class = "glyphicon glyphicon-th custom"> </i>
<i class = "glyphicon glyphicon-th-list custom"> </i>
<i class = "glyphicon glyphicon-ok custom"> </i>
<i class = "glyphicon glyphicon-remove custom"> </i>
<i class = "glyphicon glyphicon-zoom-in custom"> </i>
<i class = "glyphicon glyphicon-zoom-out custom"> </i>
<i class = "glyphicon glyphicon-off custom"> </i>
<i class = "glyphicon glyphicon-signal custom"> </i>
<i class = "glyphicon glyphicon-cog custom"> </i>
<i class = "glyphicon glyphicon-thùng rác tùy chỉnh"> </i>
<i class = "glyphicon glyphicon-home custom"> </i>
<i class = "glyphicon glyphicon-file custom"> </i>
<i class = "glyphicon glyphicon-time custom"> </i>
<i class = "glyphicon glyphicon-road custom"> </i>
<i class = "glyphicon glyphicon-download-alt custom"> </i>
<i class = "glyphicon glyphicon-tải xuống tùy chỉnh"> </i>
<i class = "glyphicon glyphicon-upload custom"> </i>
<i class = "glyphicon glyphicon-inbox custom"> </i>
<i class = "glyphicon glyphicon-play-circle custom"> </i>
<i class = "glyphicon glyphicon-lặp lại tùy chỉnh"> </i>
<i class = "glyphicon glyphicon-refresh tùy chỉnh"> </i>
<i class = "glyphicon glyphicon-list-alt custom"> </i>
<i class = "glyphicon glyphicon-lock tùy chỉnh"> </i>
<i class = "glyphicon glyphicon-flag custom"> </i>
<i class = "glyphicon glyphicon-tai nghe tùy chỉnh"> </i>
<i class = "glyphicon glyphicon-volume-off custom"> </i>
<i class = "glyphicon glyphicon-volume-down custom"> </i>
<i class = "glyphicon glyphicon-volume-up custom"> </i>
<i class = "glyphicon glyphicon-qrcode custom"> </i>
<i class = "glyphicon glyphicon-mã vạch tùy chỉnh"> </i>
<i class = "glyphicon glyphicon-tag tùy chỉnh"> </i>
<i class = "glyphicon glyphicon-tags tùy chỉnh"> </i>
<i class = "glyphicon glyphicon-book custom"> </i>
<i class = "glyphicon glyphicon-bookmark custom"> </i>
<i class = "glyphicon glyphicon-print custom"> </i>
<i class = "glyphicon glyphicon-camera tùy chỉnh"> </i>
<i class = "glyphicon glyphicon-font custom"> </i>
<i class = "glyphicon glyphicon-bold custom"> </i>
<i class = "glyphicon glyphicon-italic custom"> </i>
<i class = "glyphicon glyphicon-text-height custom"> </i>
<i class = "glyphicon glyphicon-text-width custom"> </i>
<i class = "glyphicon glyphicon-align-left custom"> </i>
<i class = "glyphicon glyphicon-align-center custom"> </i>
<i class = "glyphicon glyphicon-align-right custom"> </i>
<i class = "glyphicon glyphicon-align-justify custom"> </i>
<i class = "glyphicon glyphicon-list custom"> </i>
<i class = "glyphicon glyphicon-indent-left custom"> </i>
<i class = "glyphicon glyphicon-indent-right custom"> </i>
<i class = "glyphicon glyphicon-facetime-video custom"> </i>
<i class = "glyphicon glyphicon-picture custom"> </i>
<i class = "glyphicon glyphicon-map-marker custom"> </i>
<i class = "glyphicon glyphicon-điều chỉnh tùy chỉnh"> </i>
<i class = "glyphicon glyphicon-tint custom"> </i>
<i class = "glyphicon glyphicon-edit custom"> </i>
<i class = "glyphicon glyphicon-share custom"> </i>
<i class = "glyphicon glyphicon-kiểm tra tùy chỉnh"> </i>
<i class = "glyphicon glyphicon-move custom"> </i>
<i class = "glyphicon glyphicon-step-back custom"> </i>
<i class = "glyphicon glyphicon-nhanh-lùi tùy chỉnh"> </i>
<i class = "glyphicon glyphicon-back custom"> </i>
<i class = "glyphicon glyphicon-play custom"> </i>
<i class = "glyphicon glyphicon-pause custom"> </i>
<i class = "glyphicon glyphicon-stop tùy chỉnh"> </i>
<i class = "glyphicon glyphicon-forward custom"> </i>
<i class = "glyphicon glyphicon-tua nhanh tùy chỉnh"> </i>
<i class = "glyphicon glyphicon-step-forward custom"> </i>
<i class = "glyphicon glyphicon-eject custom"> </i>
<i class = "glyphicon glyphicon-chevron-left custom"> </i>
<i class = "glyphicon glyphicon-chevron-right custom"> </i>
<i class = "glyphicon glyphicon-dấu cộng-dấu tùy chỉnh"> </i>
<i class = "glyphicon glyphicon-dấu trừ-dấu tùy chỉnh"> </i>
<i class = "glyphicon glyphicon-remove-sign custom"> </i>
<i class = "glyphicon glyphicon-ok-sign custom"> </i>
<i class = "glyphicon glyphicon-question-sign custom"> </i>
<i class = "glyphicon glyphicon-info-sign custom"> </i>
<i class = "glyphicon glyphicon-screenshot tùy chỉnh"> </i>
<i class = "glyphicon glyphicon-remove-circle custom"> </i>
<i class = "glyphicon glyphicon-ok-circle custom"> </i>
<i class = "glyphicon glyphicon-ban-circle custom"> </i>
<i class = "glyphicon glyphicon-arrow-left custom"> </i>
<i class = "glyphicon glyphicon-arrow-right custom"> </i>
<i class = "glyphicon glyphicon-arrow-up custom"> </i>
<i class = "glyphicon glyphicon-arrow-down custom"> </i>
<i class = "glyphicon glyphicon-share-alt custom"> </i>
<i class = "glyphicon glyphicon-resize-full custom"> </i>
<i class = "glyphicon glyphicon-resize-small custom"> </i>
<i class = "glyphicon glyphicon-exclamation-sign custom"> </i>
<i class = "glyphicon glyphicon-gift custom"> </i>
<i class = "glyphicon glyphicon-lá tùy chỉnh"> </i>
<i class = "glyphicon glyphicon-fire custom"> </i>
<i class = "glyphicon glyphicon-eye-open custom"> </i>
<i class = "glyphicon glyphicon-eye-close custom"> </i>
<i class = "glyphicon glyphicon-warning-sign custom"> </i>
<i class = "glyphicon glyphicon-plane custom"> </i>
<i class = "glyphicon glyphicon-lịch tùy chỉnh"> </i>
<i class = "glyphicon glyphicon-tùy chỉnh ngẫu nhiên"> </i>
<i class = "glyphicon glyphicon-comment custom"> </i>
<i class = "glyphicon glyphicon-magnet custom"> </i>
<i class = "glyphicon glyphicon-chevron-up tùy chỉnh"> </i>
<i class = "glyphicon glyphicon-chevron-down custom"> </i>
<i class = "glyphicon glyphicon-retweet tùy chỉnh"> </i>
<i class = "glyphicon glyphicon-shopping-cart custom"> </i>
<i class = "glyphicon glyphicon-folder-close custom"> </i>
<i class = "glyphicon glyphicon-folder-open custom"> </i>
<i class = "glyphicon glyphicon-resize-vertical custom"> </i>
<i class = "glyphicon glyphicon-resize-ngang tùy chỉnh"> </i>
<i class = "glyphicon glyphicon-hdd tùy chỉnh"> </i>
<i class = "glyphicon glyphicon-bullhorn custom"> </i>
<i class = "glyphicon glyphicon-bell custom"> </i>
<i class = "glyphicon glyphicon-certificate custom"> </i>
<i class = "glyphicon glyphicon-thumbs-up tùy chỉnh"> </i>
<i class = "glyphicon glyphicon-thumbs-down custom"> </i>
<i class = "glyphicon glyphicon-hand-right custom"> </i>
<i class = "glyphicon glyphicon-hand-left custom"> </i>
<i class = "glyphicon glyphicon-hand-up custom"> </i>
<i class = "glyphicon glyphicon-hand-down custom"> </i>
<i class = "glyphicon glyphicon-circle-arrow-right custom"> </i>
<i class = "glyphicon glyphicon-circle-arrow-left custom"> </i>
<i class = "glyphicon glyphicon-circle-arrow-up custom"> </i>
<i class = "glyphicon glyphicon-circle-arrow-down custom"> </i>
<i class = "glyphicon glyphicon-global custom"> </i>
<i class = "glyphicon glyphicon-cờ lê tùy chỉnh"> </i>
<i class = "glyphicon glyphicon-task custom"> </i>
<i class = "glyphicon glyphicon-filter custom"> </i>
<i class = "glyphicon glyphicon-cặp tùy chỉnh"> </i>
<i class = "glyphicon glyphicon-fullscreen custom"> </i>
<i class = "glyphicon glyphicon-dashboard custom"> </i>
<i class = "glyphicon glyphicon-paperclip tùy chỉnh"> </i>
<i class = "glyphicon glyphicon-heart-blank custom"> </i>
<i class = "glyphicon glyphicon-link custom"> </i>
<i class = "glyphicon glyphicon-phone custom"> </i>
<i class = "glyphicon glyphicon-pushpin custom"> </i>
<i class = "glyphicon glyphicon-usd custom"> </i>
<i class = "glyphicon glyphicon-gbp custom"> </i>
<i class = "glyphicon glyphicon-sắp xếp tùy chỉnh"> </i>
<i class = "glyphicon glyphicon-sort-by-alphabet custom"> </i>
<i class = "glyphicon glyphicon-sort-by-alphabet-alt custom"> </i>
<i class = "glyphicon glyphicon-sort-by-order custom"> </i>
<i class = "glyphicon glyphicon-sort-by-order-alt custom"> </i>
<i class = "glyphicon glyphicon-sort-by-thuộc tính tùy chỉnh"> </i>
<i class = "glyphicon glyphicon-sort-by-properties-alt tùy chỉnh"> </i>
<i class = "glyphicon glyphicon-unhecked custom"> </i>
<i class = "glyphicon glyphicon-expand tùy chỉnh"> </i>
<i class = "glyphicon glyphicon-sập-xuống tùy chỉnh"> </i>
<i class = "glyphicon glyphicon-sập-up tùy chỉnh"> </i>
<i class = "glyphicon glyphicon-log-in tùy chỉnh"> </i>
<i class = "glyphicon glyphicon-flash tùy chỉnh"> </i>
<i class = "glyphicon glyphicon-log-out custom"> </i>
<i class = "glyphicon glyphicon-new-window custom"> </i>
<i class = "glyphicon glyphicon-record custom"> </i>
<i class = "glyphicon glyphicon-save custom"> </i>
<i class = "glyphicon glyphicon-open custom"> </i>
<i class = "glyphicon glyphicon lưu tùy chỉnh"> </i>
<i class = "glyphicon glyphicon-import custom"> </i>
<i class = "glyphicon glyphicon-export custom"> </i>
<i class = "glyphicon glyphicon-gửi tùy chỉnh"> </i>
<i class = "glyphicon glyphicon-floppy-disk custom"> </i>
<i class = "glyphicon glyphicon-floppy-lưu tùy chỉnh"> </i>
<i class = "glyphicon glyphicon-floppy-remove custom"> </i>
<i class = "glyphicon glyphicon-floppy-save custom"> </i>
<i class = "glyphicon glyphicon-floppy-open custom"> </i>
<i class = "glyphicon glyphicon-credit-card custom"> </i>
<i class = "glyphicon glyphicon-chuyển tùy chỉnh"> </i>
<i class = "glyphicon glyphicon-dao kéo tùy chỉnh"> </i>
<i class = "glyphicon glyphicon-header custom"> </i>
<i class = "glyphicon glyphicon-nén tùy chỉnh"> </i>
<i class = "glyphicon glyphicon-earphone tùy chỉnh"> </i>
<i class = "glyphicon glyphicon-phone custom"> </i>
<i class = "glyphicon glyphicon-tháp tùy chỉnh"> </i>
<i class = "glyphicon glyphicon-stats custom"> </i>
<i class = "glyphicon glyphicon-sd-video tùy chỉnh"> </i>
<i class = "glyphicon glyphicon-hd-video tùy chỉnh"> </i>
<i class = "glyphicon glyphicon-subtitles custom"> </i>
<i class = "glyphicon glyphicon-sound-stereo custom"> </i>
<i class = "glyphicon glyphicon-sound-dolby custom"> </i>
<i class = "glyphicon glyphicon-sound-5-1 custom"> </i>
<i class = "glyphicon glyphicon-sound-6-1 custom"> </i>
<i class = "glyphicon glyphicon-sound-7-1 custom"> </i>
<i class = "glyphicon glyphicon-copyright-mark custom"> </i>
<i class = "glyphicon glyphicon-register-mark custom"> </i>
<i class = "glyphicon glyphicon-cloud-download custom"> </i>
<i class = "glyphicon glyphicon-cloud-upload custom"> </i>
<i class = "glyphicon glyphicon-tree-conifer custom"> </i>
<i class = "glyphicon glyphicon-cây-rụng lá tùy chỉnh"> </i>