Các biểu tượng cơ bản(Glyphicons)
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>
<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
Không có nhận xét nào:
Đăng nhận xét