Tự học Bootstrap - Cơ bản - bài 11 – Các biểu tượng cơ bản trong web

Các biểu tượng cơ bản(Glyphicons)

Bootstrap cung cấp 260 biểu tượng trong bộ sưu tập Glyphicons Halflings.

Các biểu tượng có thể được sử dụng trong văn bản, các nút bấm, các thanh công cụ, menu điều hướng, các biểu mẫu...

Sau đây là vài ví dụ:

Biểu tượng Hộp thư:

Biểu tượng In:

Biểu tượng Tìm Kiếm:

Biểu tượng Tải Xuống:

---

Cú pháp

01 biểu tượng được chèn với cú pháp như sau:

<span class="glyphicon glyphicon-name"></span>

Phần name trong cú pháp trên sẽ được thay thế bởi tên của biểu tượng.

---

Ví dụ về biểu tượng

<p>Envelope icon: <span class="glyphicon glyphicon-envelope"></span></p>
<p>Envelope icon as a link:
  <a href="#"><span class="glyphicon glyphicon-envelope"></span></a>
</p>
<p>Search icon: <span class="glyphicon glyphicon-search"></span></p>
<p>Search icon on a button:
  <button type="button" class="btn btn-default">
    <span class="glyphicon glyphicon-search"></span> Search
  </button>
</p>
<p>Search icon on a styled button:
  <button type="button" class="btn btn-info">
    <span class="glyphicon glyphicon-search"></span> Search
  </button>
</p>
<p>Print icon: <span class="glyphicon glyphicon-print"></span></p>
<p>Print icon on a styled link button:
  <a href="#" class="btn btn-success btn-lg">
    <span class="glyphicon glyphicon-print"></span> Print
  </a>
</p>

Lophocvitinh.COM***Tự học Bootstrap - Phần cơ... bởi minh-nguyen48